微信号:infoqchina

介绍:有内容的技术社区媒体

别闯进Hybrid App的误区

2014-03-24 20:02 InfoQ

【引言】Hybrid App,一种开发模式,兼顾Web和Native的一种开发模式。有人说它把Web App扼杀在摇篮里,有人说它把Native App引向一个新阶段。我说,它是一把双刃剑,千万别闯进它的误区。本文是笔者在实践Hybrid App开发模式过程中总结出的一些经验教训,供读者参考。Hybrid App虽好,可万万不能仓促选择,盲目运用。

 

本文主要跟大家分享一下我团队和个人在Hybrid App的实践中遇到的问题,提醒大家不要闯进Hybrid App的误区。

 

误区一:为了HTML 5而HybridApp。

HTML 5在Hybrid App模式中是一个最常被提起的概念。HTML 5作为一个HTML 4.0.1和XHTML 1.0的升级版,基于旧版本有更强大的表现功能,并加入了LocalStorage等技术,确实为Web页面提供了更大的想象空间和更多的可能性。但HTML 5处在目前的发展阶段,受到浏览器兼容性和手机硬件性能水平的影响,它所能提供的功能与Native仍然有很大差距。

 

所以,我认为作为工程师要明确一款App采用Hybrid App模式的根本原因是什么。作为一款App其最根本的功能是满足使用者的需求,而并不是服务某项新技术。因此当决定采用Hybrid App去构建一款应用时,应该从应用本身功能特点和整个团队的开发资源配比统一考虑,是否有必要同时又有能力去驾驭一款“Native搭台,HTML唱戏”的Hybrid App。

 

误区二:忽略关键因素

在谈到Hybrid App的场合我们更多提及的是它有诸多优点,如何架构一个Hybrid App,怎么让Web和Native和谐共处,然而Web开发中会被忽略的一些因素少被提起,这些因素又恰恰经常是一个Web页面能否正常运行在App中的决定性因素。

 

Web开发是基于PC的一种开发模式,开发者使用PC浏览器模拟App中的Web View进行调试。PC浏览器与手机Web View的区别是巨大的,能支配的CPU资源,最大占有的内存,运行的网络环境,鼠标操作与触控操作的区别,浏览器对CSS/JS的解析和对事件处理,等等。

 

App工程师,无论是iOS还是Android,最敏感的一个问题莫过于内存管理,而在Web开发则对这个问题没有过多注意。这就经常导致同一个功能界面Native实现中会通过一些技术手段,把内存容量控制在操作系统允许的范围内保证App正常运行。如果以Web方式接入App的页面没有一个明确的标准和严格的验收机制,相应的Web实现则不会过多考虑这方面的问题,而且浏览器也没有给前端工程师提供足够的Api支持处理内存问题,导致在某些条件下造成App无法正常运行,甚至Crash。

 

同样的问题会出现在网络环境方面,虽然现在wifi覆盖越来越广,3G网络也日益普及,但App运行的网络环境与PC相比仍然有着巨大差距,wifi和蜂窝网络的切换,基站变化等诸多因素都会导致网络间歇性断开。Web开发总是默认有一个稳定的网络环境,因此在对于不稳定网络环境问题的处理上也有所欠缺。没有明确的对于低速网络或不稳定网络访问的处理,在很多情况下这些页面也会非常不给面子。

 

误区三:富交互导致体验差

这里所谓的体验问题一分为二:一是与手机平台默认交互习惯不一致的体验,二是与同样功能Native界面存在的体验差距。

 

无论在Android还是iOS平台上,都有各自的一套交互习惯,包括视觉风格,界面切换,操作习惯等,与Web习惯完全不同。如果使用Web方式开发富交互的页面,或多页面功能就会出现这样的问题。

 

另一个方面,也是上述提到的与Native相比,同样的功能在性能上存在巨大差距。Web界面上JS对HTML Node的操作需要消耗大量的CPU资源,手机CPU的性能还不能与PC相提并论,就算在智能手机之间,硬件水准也参差不齐,一个可以在iPhone 5上流畅运行的界面,跑到三星S III上很可能就卡住不动了。所以我们经常可以发现一些富交互页面上的操作无法达到令人满意的流畅度,而流畅度也正是用户评价一款App优劣的最直观因素。

 

误区四:跨平台

一次开发,跨平台运行是Web的优势,这也是很多App采用Hybrid模式的重要原因之一。兼容性问题在Web开发过程中往往不被关注,但当下智能手机的软硬件版本众多,兼容性绝对是一个不容忽视的问题。

 

误区五:交互一致性。

交互一致性是一个非常容易被误读的概念,“一致性”经常被理解为同一个应用在各种平台和场景下要有一致性的体验。我认为在移动平台开发过程中,“一致性”应该是App视觉和交互习惯与其运行平台的习惯保持一致。而Web开发“一次开发,跨平台运行”的特性与此存在一定程度上的冲突。

 

以“返回上一页面”的操作为例,在iOS平台上在页面顶部始终存在一个44像素高的导航栏,左侧有一个返回按钮用于返回操作,而Android平台则习惯使用设备提供的返回键操作。这个返回按钮在iOS平台可以通过绝对地址的方式连接到任何其他页面,而在Android平台返回按钮和设备的返回键则可能指向不同的位置。

 

Hybrid App方案是一把双刃剑,一方面它平衡了Native App和Web页面的优缺点,一定程度上解决了Native App开发过程中迭代慢,版本依赖,Native开发资源不足的问题,但另一个方面过度依赖Hybrid方案会造成Web前端开发成本快速上升,甚至造成App整体体验下降,甚至造成功能缺失。

 

不要为了Hybrid而Hybrid,控制好方案中Native与Web的边界。

 

更多精彩内容,请点击阅读原文。


***********************************
本文来自InfoQ微信公众账号:infoqchina
1、回复“今日新闻”,查看今天更新的新闻;
2、回复“今日英文”,查看今天英文站的更新;
3、回复“文章 +关键词”,搜索关键词相关内容;
4、回复“QCon”,了解QCon大会相关信息;
5、回复“活动”,了解最近InfoQ组织的线下沙龙;
6、回复“架构师”,获取《架构师》下载地址;
7、回复“投稿”,了解投稿和加入编辑团队的流程。
***********************************

 
InfoQ 更多文章 Facebook如何实现PB级别数据库自动化备份 学术派Google软件工程师Matt Welsh谈移动开发趋势 Spotify为什么要使用一些“无聊”的技术? 妹纸们放假了,汉纸们做啥? 大多数重构可以避免
猜您喜欢 当男神变胖了还会继续爱吗 聊聊代码规范 Python开发包推荐系列之xml、html解析器PyQuery 精彩世界杯,竞猜拿奖不能停 还有人用么?数据显示Windows Phone用户正集体转用Android