HybridApp（⼀）App开发选型
1、⼏种app开发模式概述
Native App
即传统的原⽣APP开发模式,Android基于Java语⾔，底层调⽤Google的 API;iOS基于OC或者Swift语⾔，底层调⽤App官⽅提供的API。体验最好。
Web App
即移动端的⽹站，将页⾯部署在服务器上，然后⽤户使⽤各⼤浏览器访问。⼀般泛指 SPA(Single Page Application)模式开发出的⽹站。体验最差。
Hybrid App
即混合开发，由Native通过JSBridge等⽅法提供统⼀的API，然后⽤Html5+JS来写实际的逻辑，调⽤API，这种模式下，由于Android,iOS的API⼀般有⼀致性,⽽且最终的页⾯也是在webview中显⽰，所有有跨平台效果
React Native App
Facebook发起的开源的⼀套新的APP开发⽅案，使⽤JS+部分原⽣语法来实现功能。初次学习成本较⾼，但是在⼊门后，经过良好的封装也能够实现⼤部分的跨平台。⽽且体验很好。
2、app开发模式优缺点
Native App
即原⽣开发模式，开发出来的是原⽣程序，不同平台上,Android和iOS的开发⽅法不同，开发出来的是⼀个独⽴的APP，能发布应⽤商店，有如下优点和缺点
优点
直接依托于操作系统，交互性最强，性能最好
相⽐于其它模式的交互，原⽣APP体验是最优的
功能最为强⼤，特别是在与系统交互中,⼏乎所有功能都能实现
得益于原⽣是直接依托于系统的，所以可以直接调⽤官⽅提供的api，功能最为全⾯(⽐如本地资源操作，通知，动画等)
缺点
开发成本⾼,⽆法跨平台，不同平台Android和iOS上都要各⾃独⽴开发
Android上基于Java开发,iOS上基于OC或Swift开发，相互之间独⽴，必须要有各⾃的开发⼈员
门槛较⾼，原⽣⼈员有⼀定的⼊门门槛，相⽐⼴⼤的前端⼈员⽽⾔，较少
原⽣的⼀个很⼤特点就是独⽴，所以不太容易⼊门，不像web前端⼀样那么⼴泛,⽽且Android,iOS都需要独⽴学习
更新缓慢，特别是发布应⽤商店后，需要等到审核周期
原⽣应⽤更新是⼀个很⼤的问题,Android中还能直接下载整包APK进⾏更新，但是iOS中，如果是发布AppStore，必须通过AppStore地址更新,⽽每次更新都需要审核，所以⽆法达到及时更新
维护成本⾼
同开发⼀样，项⽬上线后，维护起来也很为⿇烦
Web App
即移动端的⽹站，将页⾯部署在服务器上，然后⽤户使⽤各⼤浏览器访问，不是独⽴APP,⽆法安装和发布
Web⽹站⼀般分两种,MPA(Multi-page Application)和SPA(Single-page Application)。⽽Web App⼀般泛指后⾯的SPA形式开发出的⽹站(因为可以模仿⼀些APP的特性)，有如下优点和缺点
优点
开发成本低，可以跨平台，调试⽅便
web app⼀般只需要⼀个前端⼈员开发出⼀套代码，然后即可应⽤于各⼤主流浏览器(特殊情况可以代码进⾏下兼容)，没有新的学习成本,⽽且可以直接在浏览器中调试
维护成本低
同上，如果代码合理，只需要⼀名前端就可以维护多个web app
更新最为快速
由于web app资源是直接部署在服务器端的，所以只需要替换服务器端的⽂件,⽤户访问是就已经更新了(当然需要解决⼀些缓存问题)
⽆需安装App，不会占⽤⼿机内存
通过浏览器即可访问,⽆需安装,⽤户就会⽐较愿意去⽤
缺点
性能低,⽤户体验差
由于是直接通过的浏览器访问，所以⽆法使⽤原⽣的API，操作体验不好
依赖于⽹络，页⾯访问速度慢，耗费流量
Web App每次访问都需要去服务端加载资源访问，所以必须依赖于⽹络,⽽且⽹速慢时访问速度很不理想，特别是在移动端，如果⽹站优化不好会⽆故消耗⼤量流量
功能受限,⼤量功能⽆法实现
只能使⽤Html5的⼀些特殊api,⽆法调⽤原⽣API，所以很多功能存在⽆法实现情况
临时性⼊⼝,⽤户留存率低
这既是它的优点，也是缺点，优点是⽆需安装，确定是⽤完后有时候很难再到，或者说很难专门为某个web app留存⼀个⼊⼝，导致⽤户很难再次使⽤
Hybrid App
即混合开发，也就是半原⽣半Web的开发模式，有跨平台效果，当然了，实质最终发布的仍然是独⽴的原⽣APP(各种的平台有各种的SDK)，有如下优点和缺点
优点
开发成本较低，可以跨平台，调试⽅便
Hybrid模式下，由原⽣提供统⼀的API给JS调⽤，实际的主要逻辑有Html和JS来完成,⽽由于最终是放在webview中显⽰的，所以只需要写⼀套代码即可，达到跨平台效果，另外也可以直接在浏览器中调试，很为⽅便
最重要的是只需要⼀个前端⼈员稍微学习下JS api的调⽤即可,⽆需两个独⽴的原⽣⼈员
⼀般Hybrid中的跨平台最少可以跨三个平台:Android App,iOS App，普通webkit浏览器
维护成本低，功能可复⽤
同上，如果代码合理，只需要⼀名前端就可以维护多个app,⽽且很多功能还可以互相复⽤
更新较为⾃由
虽然没有web app更新那么快速，但是Hybrid中也可以通过原⽣提供api，进⾏资源主动下载，达到只更新资源⽂件，不更新apk(ipa)的效果
针对新⼿友好，学习成本较低
这种开发模式下，只需要前端⼈员关注⼀些原⽣提供的API，具体的实现⽆需关⼼，没有新的学习内容，只需要前端⼈员即可开发
功能更加完善，性能和体验要⽐起web app好太多
因为可以调⽤原⽣api，所以很多功能只要原⽣提供出就可以实现，另外性能也⽐较接近原⽣了
部分性能要求的页⾯可⽤原⽣实现
这应该是Hybrid模式的最多⼀个好处了，因为这种模式是原⽣混合web，所以我们完全可以将交互强，性能要求⾼的页⾯⽤原⽣写，然后⼀些其它页⾯⽤JS写，嵌⼊webview中，达到最佳体验
缺点
相⽐原⽣，性能仍然有较⼤损耗
这种模式受限于webview的性能桎梏，相⽐原⽣⽽⾔有不少损耗，体验⽆法和原⽣相⽐
不适⽤于交互性较强的app
这种模式的主要应⽤是:⼀些新闻阅读类，信息展⽰类的app；但是不适⽤于⼀些交互较强或者性能要求较⾼的app(⽐如动画较多就不适合)
React Native App
Facebook发起的开源的⼀套新的APP开发⽅案,Facebook在当初深⼊研究Hybrid开发后，觉得这种模式有先天的缺陷，所以果断放弃，转⽽⾃⾏研究，后来推出了⾃⼰的“React Native”⽅案，不同于H5，也不同于原⽣，更像是⽤JS写出原⽣应⽤，有如下优点和缺点
其实很多⼤公司都已经转React Native开发了，已经很成熟了
优点
虽然说开发成本⼤于Hybrid模式，但是⼩于原⽣模式,⼤部分代码可复⽤
相⽐于原⽣模式，这种模式是统⼀⽤JS写代码，所以往往只需要⼀名成员投⼊学习，即可完成跨平台app的开发,⽽且后续代码封装的好，很多功能可复⽤
性能体验⾼于Hybrid，不逊⾊与原⽣
这种模式和Hybrid不⼀样,Hybrid中的view层实际上还是dom，但是这种模式的view层是虚拟dom，所以性能要⾼于Hybrid，距离原⽣差距不⼤
这种模式可以认为是⽤JS写原⽣，即页⾯⽤JS写，然后原⽣通过Bridge技术分析JS，将JS内容单独渲染成原⽣Android和iOS，所以也就是为什么性能不逊⾊原⽣
开发⼈员单⼀技术栈,⼀次学习，跨平台开发
这种模式是统⼀由JS编写，有着独特的语法，所以只需要学习⼀次，即可同时开发Android和iOS
社区繁荣，遇到问题容易解决
这应该是React Native的很⼤⼀个优势，不像Hybrid模式和原⽣模式⼀样各⾃为营，这种模式是Facebook统⼀发起的，所以有⼀个统⼀的社区,⾥⾯有⼤量资源和活跃的⼈员，对开发者很友好
缺点
虽然可以部分跨平台，但并不是Hybrid中的⼀次编写，两次运⾏那种,⽽是不同平台代码有所区别
这种模式实际上还是JS来写原⽣，所以Android和iOS中的原⽣代码会有所区别，如果需要跨平台，对开发⼈员有⼀定要求
当然了，如果发展了有⼀定时间，组件库够丰富了，那么其实影响也就不⼤了，甚⾄会⽐Hybrid更快
开发⼈员学习有⼀定成本
虽然社区已经⽐较成熟了，但是⼀个新的普通前端学习起来还是有⼀定学习成本的,⽆法像Hybrid模式⼀样平滑
3、app开发模式对
Native App Web App Hybrid App React Native
App
原⽣功能体验优秀差良好接近优秀
渲染性能⾮常快慢接近快快
是否⽀持设备底
层访问
⽀持不⽀持⽀持⽀持
⽹络要求⽀持离线依赖⽹络⽀持离线(资源
存本地情况)
⽀持离线
更新复杂度⾼(⼏乎总是通过应⽤商店更
新)低(服务器端直
接更新)
较低(可以进⾏
资源包更新)
较低(可以进⾏
资源包更新)
编程语⾔Android(Java),iOS(OC/Swift)js+html+css3js+html+css3主要使⽤JS编
写，语法规则
JSX
社区资源丰富(Android,iOS单独学习)丰富(⼤量前端
资源)有局限(不同的
Hybrid相互独
⽴)
丰富(统⼀的活
跃社区)
上⼿难度难(不同平台需要单独学习)简单(写⼀次,⽀
持不同平台访简单(写⼀次，运
⾏任何平台)
中等(学习⼀次,
写任何平台)
问)
开发周期长短较短中等
开发成本昂贵便宜较为便宜中等
Android,iOS
跨平台不跨平台所有H5浏览器Android,iOS,h5
原生js和js的区别浏览器
APP发布App Store Web服务器App Store App Store
4、app开发模式的选型
选择纯Native App模式的情况
性能要求极⾼，体验要求极好，不追求开发效率
⼀般属于吹⽑求疵的那种级别了，因为正常来说如果要求不是特别⾼，会有Hybrid
选择Web App模式的情况
不追求⽤户体验和性能，对离线访问没要求
正常来说，如果追求性能和体验，都不会选⽤web app
没有额外功能，只有⼀些信息展⽰
因为web有限制，很多功能都⽆法实现，所以有额外功能就只能弃⽤这种⽅案了
选择Hybrid App模式的情况
⼤部分情况下的App都推荐采⽤这种模式
这种模式可以⽤原⽣来实现要求⾼的界⾯，对于⼀些⽐较通⽤型，展⽰型的页⾯完全可以⽤web来实现，达到跨平台效果，提升效率
当然了,⼀般好⼀点的Hybrid⽅案，都会把资源放在本地的，可以减少⽹络流量消耗
选择React Native App模式的情况
追求性能，体验，同时追求开发效率,⽽且有⼀定的技术资本，舍得前期投⼊
React Native这种模式学习成本较⾼，所以需要前期投⼊不少时间才能达到较好⽔平，但是有了⼀定⽔准后，开发起来它的优势就体现出来了，性能不逊⾊原⽣,⽽且开发速度也很快

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。