一、Ionic
1、概念:
ionic是基于Web技术HTML5、CSS3和JavaScript技术进行智能设备APP开发的框架,具有很好的跨平台性能,被称为Hybird App框架。这个框架的目的是从web的角度开发手机应用,基于PhoneGap(Cordova)的编译平台,可以实现编译成各个平台的应用程序。
2、Ionic能做什么?
可以快速开发移动App、移动端WEB页面、混合app web页面等
3、目前状况
Ionic4目前已经发布了基于Angular的正式版本,对 React 和 Vue 的支持尚处于 alpha 状态(内测)。Ionic需基于Angular来开发,虽然目前有部分组件或者插件来支持react和vue,它未来的目标是支持大部分主流的web框架,让开发人员用自己喜欢的语言或框架来开发移动应用。
4、优缺点
优点
(1)ionic 基于Angular语法,简单易学
(2)ionic 是一个轻量级框架
(3)开发速度快且代码易维护
(4)ionic提供了很多 UI 组件来帮助开发者开发强大的应用
(5)ionic 提供了强大的命令行工具
(6)ios 和 android 基本上可以共用代码,一次编码,到处运行
(7)可实现在线更新,及时版本更新迭代
(8)有相对比较齐全的官方文档缺点
(1)兼容性不够好(android低版本、低设备,它更注重于兼容移动手机端而忽略浏览器端)
(2)性能不够好,渲染速度慢
(3)没有统一管理好插件库,导致插件库维护成本较高,且部分功能的插件库可能缺失,需要自己封装
(4)某些功能很难实现跟原生的互补,web技术无法解决一切问题
二、ReactNative(简称RN)
1、概念:RN是由facebook开源的基于JavaScript和React搭建的一套跨平台的开发框架。React通过虚拟DOM的操作来控制真实的DOM,从而得到页面的局部更新,提高GPU的渲染性能。它提倡的是Learn once,write anywhere,所以学习react,可以编写web网页、android和ios平台的应用。
2、RN能做什么?
开发跨平台的app,android和ios两个平台统一一套代码维护,实现相同的逻辑,UI方面除了部分APi或者组件有平台的差异性以外,基本可实现相同的页面和交互。
3、目前状况
目前RN的最新版本为0.62,还没出一个1.0的完整版本,而且学习文档相对较缺乏,但是RN的活跃数较高,有比较活跃的社区,开源的RN第三方库也较多。
4、优缺点
优点
(1)比原生开发更为灵活和高效,对比h5的体验更好,性能方面接近原生
(2)可以远程调试代码,热加载
(3)轻松实现热更新,可以在线更新代码
(4)跨平台,实现一套代码跑安卓和ios移动设备
(5)React Native实现不了的,可以通过原生来实现,可以互补缺点
(1)学习成本较高
(2)即使是跨平台,但是不同平台的Api特性与显示可能不一致,有些组件的显示效果也是有平台方面的差异
(3)调试必须依赖于网络,如果没有网络是无法load js的代码
(4)Android上的一些兼容性问题
总结分析:
1.Ionic基于Angular.js开发,正如RN基于react.js一样,各有千秋,需要按项目需求来决定开发框架、技术选型,当然本人更倾向于RN开发app,起码在性能和功能上有比较好的保障。
2.Angular和React的渲染机制不太一样,Angular的脏检查使得任何变动都会产生固定的更新的代价,也就是说任何小变动都会引起界面的重绘。而React是通过虚拟DOM来操作真实的DOM,通过计算状态变化的差异来进行界面渲染,只更新变化的内容。
当然,Angular也在不断优化,在渲染效率上也逐渐高于react。
3.从开发上:Ionic只需要懂JavaScript、h5、css等,不需要了解太多的原生开发语言,比较适合web前端开发人员。RN不仅需要一些js基础,还需要了解一些android和ios原生开发的基础知识,比较适合移动开发人员。
从打包发布上:Ionic依赖Cordova打包,这就需要Cordova工具及时更新出适配Android和ios的版本,不然会出现一些兼容性问题,当然也可以通过build之后的代码在相应的工具(AS、Xcode)中编译打包,但可能由于版本等因素会出现一些编译问题。RN的编译打包主要通过AS、Xcode,工具的升级更新以及代码的升级更新都比较方便。Ionic和RN都有相应的热更新插件,可以线上更新代码。