`
neolcs
  • 浏览: 630 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

Hybrid方式在移动开发上的回归

阅读更多
从去年后半年开始,移动开发似乎到一个瓶颈期,纯Native开发模式开始被质疑和审视,基于React的新的一体化开发方式开始出现,开始吸引大家的眼球。由于纯Native开发需要维护iOS和Android两个项目,管理两份代码,而之间代码共享很差,因此开发和维护的成本太高,不过React方式也需要两份代码,而且目前还有很多地方需要完善(比如ListView)。或许现在是时候重新考虑尝试Hybrid方式回归到移动开发了,相比于Native和React的方式,Hybrid很大程度的满足我们的期望:
  • 能够跨平台,最大程度上实现代码互通
  • 有比较好的运行效率,不能有让人讨厌的延迟和卡顿
  • 开发调试方便,对程序员友好
  • 有比较丰富的第三方类库
  • 可以根据具体移动平台(iOS or Android)进行定制

Native的程序员往往对Hybrid方式嗤之以鼻,认为这不过是JS程序员在移动上的玩具,或者只是做一个容易配置的活动页面。不过现在已和往日不同,由于手机性能大幅提升和SPA框架的完善,H5页面已经基本可以作为一个功能完备的方式来应付移动开发的方方面面了。
两个月前,我们开始了一个新的项目,便是采用了基于Cordova的Hybrid方式。项目的架构如下:

这里我们需要准备三个工程,两个Native工程和一个H5的工程。具体哪些功能放在Native工程哪些放在H5里,可以根据实际情况进行调整,一般来讲,Native工程设置的icon,闪屏页,启动逻辑,更新逻辑,以及一些其他有必要放在Native去实现的需求。H5工程用来实现主要功能,开发过程中独立开发调试,发布的时候生成www文件夹到工程目录里。
Cordova可以提供Native和H5的程序互调。目前Cordova社区有很多Camera,Location等plugin可以使用,而且平台开放,可以自行开发需要的plugin。
Web页面的呈现需要加载各种js, css资源,生成dom和显示,新开一个页面会有比较长时间的卡顿和白屏,因此在移动平台上的Hybrid开发,应该使用SPA方式,避免多页面切换带来的问题。目前SPA已经有很多比较好的框架可以使用,如Ionic和vuejs,提供移动的ui模块和事件处理,js语言的背后又有underscore等util库的支持,有很多轮子可以使用。
根据gulp或者grunt对H5工程进行配置,开发过程中在浏览器中调试,使用Mock的方式调用Camera等Native模块,发布的时候添加webpack,生成www文件夹到Native的工程中。
一般来讲,Native的工程只需开发一次,后面改动很少,而H5工程的功能可以互通使用,只需要开发一份代码即可满足两个平台使用。

目前我们的项目已经使用这种方式完成了第一次尝试,除了程序略微不稳定外(主要与Ionic 2的框架不成熟有关),使用的感受和native差别不大。以目前的手机的性能,基本主流的App需求都可以满足,主要代码不仅可以互通,部分甚至还可以和前端共用。
  • 大小: 41.6 KB
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics