一、基本对比
特点 | 原生 | Cordova | RN | Flutter |
---|---|---|---|---|
发布时间 | 2014 | 2015 | 2017 | |
维护者 | Adobe(奥多比) | |||
语言 | js | js | dart | |
代码产物 | www文件夹(网页相关资源) | jsBundle | 二进制文件 | |
支持平台 | Android、IOS | Android、IOS、(PC) | Android、IOS、(Web/PC) | |
界面顺滑度 | 丝般顺滑 | 渣 | 丝般顺滑 | 丝般顺滑 ,不过iOS风格组件较少,写出的页面太像安卓 |
开发成本 | 高,不支持跨平台 | 低,只要会前端就能开发 | 较低,有前端基础学下React | 一般,需学习dart语言 |
运行速度 | 贼高 | 渣 | 相比原生略慢 | 几乎可以达到原生性能 |
使用代表 | 微信 | 海关门户 | 京东 | 咸鱼 |
二、优缺点对比
1.原生
- 优点
1.运行效率高
- 缺点
1.不支持跨平台开发效率低
2.支持热更新应用上架APPStore被拒风险
2.Cordova
- 优点
1.开发成本低,只要会前端开发就能开Cordova页面
- 缺点
1.开发出来的界面就是网页,特别不流畅
3.RN
- 优点
1.开发成本低 Learn once, write anywhere
2.开发出来的界面更接近原生
3.第三方插件丰富
- 缺点
1.对原生安卓支持不是很好。常常要写支持安卓平台的代码
2. 编辑器不是很好用,调试需要网页调试,让我一个原生开发者无法接受
4.Flutter
- 优点
1.写出来的页面运行效率几乎和原生无差别
2.谷歌亲儿子,Android studio编辑器非常好用
3.对安卓原生支持非常好
- 缺点
1.iOS风格组件太少了,界面写出来大多安卓风格,不太习惯(也可能是iOS开发的偏见)
2.第三方插件非常丰富。
三、实现原理
- RN
- React Native 是一套 UI 框架,默认情况下 React Native 会在 Activity 下加载 JS 文件,然后运行在 JavaScriptCore 中解析 Bundle 文件布局,最终堆叠出一系列的原生控件进行渲染。
- 如
<View>
标签对应ViewGroup/UIView
,<ScrollView>
标签对应ScrollView/UIScrollView
,<Image>
标签对应ImageView/UIImageView
等
2.flutter
- Flutter 中绝大部分的 Widget 都与平台无关, 开发者基于 Framework 开发 App ,而 Framework 运行在 Engine 之上,由 Engine 进行适配和跨平台支持。这个跨平台的支持过程,其实就是将 Flutter UI 中的 Widget “数据化” ,然后通过 Engine 上的 Skia 直接绘制到屏幕上 。
网友评论