hybrid app、web app与native app工具的
主要 前端框架 和打包平台、工具
Web App(网页应用)
使用的主要前端框架 jQuery Mobile 、amazeui ThinkPHP Mobile 、 mui框架
打包工具:cordova phonegap
Hybrid App(混合应用)
使用的主要前端框架:mui框架 Vue.js React.js Ionic 即Angularjs开发生态
打包工具 Hbuilder、Appcan、Wex5、Apicloud
Native App(原生应用)
框架:ios 安卓开发语言
开发工具:Xcode、Eclipse-ADT/Android Studio
各自特点区别
Web app:
主要使用H5(html5、css3、js)语言规范来编写,对JS语言掌握要求较高 。将 APP仅仅作为一个浏览器使用,里面跑在线或者离线的HTML代码,H5代码占比超过90%。
Web app的主要工作量在于写一个兼容性好的H5页面,包括分辨率、性能、浏览器支持等问题。如果对于分别多平台(不光iOS、Android,可能还有移动网页版和微信公众平台)做Native应用来说,肯定总成本是低的。
好处是如果能一套H5代码搞定多平台的话相当省时省力。如果H5代码写的好的话,其实在主流机型上的适配和体验也都过得去。
这个方案的缺点也很明显,在低配机上性能很差,如果H5代码写的不好,兼容性问题一堆,功能、安全性也受到很大的限制。
Hybridapp:
同Webapp使用H5作为主要编程语言,JS将作为主力连接原生SDK模块,应用中包含了Native代码(就是原生代码),并且实现了部分H5体验不好、或者难以实现的逻辑(比如定位、埋点、本地持久存储、体感等)。有些情况下,程序的底层框架、核心逻辑、界面框架也会用Native来完成,H5只用来实现业务逻辑,H5代码占比在40%~80%左右。
上手难度、开发周期、跨平台属性
上手难度:
Hybridapp/Webapp:写一次,运行任何平台。简单
React-Native:学一次,写任何平台。中等
Nativeapp:学一次,只限运行特定平台。较难
开发周期:
Webapp:2~3周
Hybridapp:由于第三方工具兼容性、bug处理问题、调用js-原生模块(熟悉文档),开发周期在2个月左右
React-Native:1个半月~2个月
Nativeapp:各1个半月~2个月
跨平台属性:
Webapp:支持多平台
Hybridapp:跨iOS、Android、Wp(PhoneGap支持)多平台
React-Native:跨iOS、Android双平台
Nativeapp:不跨平台
Hybrid app与Native app(就是原生APP)相比
1)混合式app的用户体验
页面与页面之间的切换,也称转场动画。随着手机硬件系统的更新换代,webview已有很大程度的提升,但即使是在iphone 6/6s plus上仍然是假性生硬切换,即使无卡顿。那么要做到诸如微信般切换已然无可能。
iOS系统如此,安卓系统情况亦不明朗。而由于混合式app依赖模块实现原生交互,在没有大量模块实现的情况下,需要使用html5-js来代替,体验更是大打折扣。
2)UI开发受限
许多创业公司由于产品交互需求,需要将app ui做到配色一致或更个性化(如带卡通下拉刷新),而混合式app的模块UI已写固定,自由化UI定制难。
3)集成第三方sdk
Hybrid app想要使用第三方sdk,首先要使用的工具平台支持,如果平台不支持,要么你请人写iOS/android模块,要么就是等。倘若新集成的sdk出现bug,你所能做的也是等,并没有其他好的办法。