ionic react-native和native开发移动app到底那个好
ionic react-native和native开发移动app那个好 ?
移动端开发如何选型?这里介绍一下我眼中的ionic,react-native,native 三种移动端开发选型对比。欢迎大家补充指正
一、 跨平台特性
ionic : write once, run anywhere ( 一次开发,随处运行,学习成本低 会html css js就可以学会)
不涉及到系统级的开发的话, 确实是一次开发 处处运行,如果涉及到系统级API调用以及项目配置(如 ios plist文件)则需要自己手动编写cordova插件的方式达到效果(如:注册文件的打开方式),当然,网上也有可能找到可以安装的现成插件。 会html css js就可以学会 学习成本低
react-native :Learn once, write anywhere ( 一次学习,随处开发)
不涉及到与native混编的话, 统一js 进行开发 使用jsx 语法 确实能做到各端开发,但是需要针对iOS 和 android 开发两套代码。
native :使用原生java objective-c 开发, 各玩各的,无法跨平台。
二、开发方式
ionic :html + angularjs + css
使用 html + angularjs 与网页开发类似,代码只需要写一次,就可以达到跨平台效果, 系统级的调用由cordova插件解决,封装得相当好,简单易用,特殊情况的自己动手编写插件比较难,一般没有需要手动编写代码插件的情况,网上有比 较多的插件可供下载安装,可用flexbox布局。 调用方便(比如:要用摄像头插件,只需要cordova plugin add camera,然后就可以用js调用原生摄像头)
react-native :js + css
普通UI全程js开发,部分情况下需要使用与native混合的方式,没有统一的UI组件,ios组件较多,android组件较少,各自编写js文件的情况较多,简单空间和逻辑层可共用,基本上iOS和android是两套代码,可用flexbox布局。
native :java + oc|swift iOS android 不同语言开发 以及适配。
三、功能支持
ionic :编写cordova插件,则能达到全部支持 原生能完成的功能 ionic结合cordova都可以实现
UI交互 由Web实现,系统级的交互 由 cordova实现,目前 文件上传下载,url跳转以及文件打开方式 均已做验证可实现,cordova对系统级调用的支持比较好,涵盖了大部分系统功能,如摄像头,设备信息,电池,网络等,不排除潜在不支持的问题。
react-native :与native 混编 可达到全部支持
android高级组件可能需要自己实现,系统级的功能可通过安装第三方插件或者与native混编的方式实现 ,基本上功能能完全实现
native :全部支持 完全能实现
四、性能对比
ionic :虽然性能一直是html5在移动端的最大问题,但是ionic已经做得非常出色了,在ios上基本上无法区分是否是原生app
android 通过优化基本看不出和原生差别
ionic使用ionic-native-transitions 调用原生专场基本看不出和原生区别 (适合android ios)
android 2G内存以上的手机看不出和原生差别,性能接近原生。
android 低配置的手机添加 crosswalk 插件以后 体验较好,但是app打包偏大。程序运行内存占用较大(网络数据对比同款产品,内存占用100+M)
react-native :基本接近原生性能
js 到 native 需要经过两层桥接,性能与原生差别不大(网络数据对比同款产品,内存占用50 M)
native:开发者水平很重要 性能最好 (网络数据对比同款产品,内存占用30 +M)
总结:开发水平很重要,html开发的app可能比原生的更快。主要还看开发人员的水平以及会不会优化
五、优劣对比
ionic :
优势:
ios 和 android 基本上可以共用代码,纯web思维,开发速度快,简单方便,一次编码,到处运行,如果熟悉web开发,则开发难度较低。
文档很全,系统级支持封装较好,所有UI组件都是有html模拟,可以统一使用。
可实现在线更新 允许加载动态加载web js
文档多,开发者多,视频教程多 容易学习 遇到问题容易解决 技术成熟
劣势:
占用内存高一些(不过手机内存都大了不影响),不适合做游戏类型app, web技术无法解决一切问题,对于比较耗性能的地方无法利用native的思维实现优势互补,如高体验的交互,动画等。
react-native :
优势:
1、虽然不能做到一处编码到处运行,但是基本上即使是两套代码,也是相同的jsx语法,使用js进行开发。用户体验,高于html,开发效率较高 2、flexbox 布局 据说比native的自适应布局更加简单高效
可实现在线更新 2015.7.28 AppStore审核政策调整:允许运行于JavascriptCore的动态加载代码
更贴近原生开发
劣势:
1、(引)对开发人员要求较高,不是懂点web技术就行的,当官方封装的控件、api无法满足需求时 就必然需要懂一些native的东西去扩展,扩展性仍然远远不如web,也远远不如直接写Native code。
2、 (引)官方说得很隐晦:learn once, write anywhere。人家可没说run anywhere。事实上,从官方的api来看SliderIOS,SwitchIOS..等等这些控件,之后势必会出现 SliderAndroid,SwitchAndroid...,也就是很可能针对不同的平台会需要写多套代码。
3、发展还不成熟,目前很多ui组件只有ios的实现,android的需要自己实现。
(引)从Native到Web,要做很多概念转换,势必造成双方都要妥协。比如web要用一套CSS的阉割版,Native通过css-layout拿到 最终样式再转换成native原生的表达方式(比如iOS的Constraint\origin\Center等属性),再比如动画。另外,若 Android和iOS都要做相同的封装,概念转换就更复杂 5、文档还不够完整 学习曲线偏高
4.文档少 学习起来困难
native :
优势:
最好的体验以及功能实现。
完善成熟的开发文档以及demo。
劣势:
android开发学习曲线较高。
各个平台分开开发 很难有iOS,android双平台高手。
开发成本高
ionic react-native和native开发移动app到底那个好的更多相关文章
- 我想外包开发一个APP,需要多少钱,多少时间?
在一个阳光明媚的下午,我正瘫坐在椅子上改bug.忽然有人给我发微信:“我想做个app,多长时间,多少钱?” 从我从业iOS开发到现在,这个问题被问过无数次,比那句:“你是程序员,那你会修电脑吗?”还要 ...
- ionic react-native和native开发移动app那个好
ionic react-native和native开发移动app那个好 ? 移动端开发如何选型?这里介绍一下我眼中的ionic,react-native,native 三种移动端开发选型对比.欢迎大家 ...
- 带你从零学ReactNative开发跨平台App开发[react native SqlLite 终极运用](十二)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发-[react native 仿boss直聘](十三)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- React Native – 使用 JavaScript 开发原生应用
前不久,Facebook 在F8开发者大会上正式开源了 React Native 项目.不过目前只有 iOS 版,Android 版还需要再等一段时间,这是最新的用 JavaScript 语言开发原生 ...
- 使用React Native来撰写跨平台的App
React Native 是一个 JavaScript 的框架,用来撰写实时的.可原生呈现 iOS 和 Android 的应用.其是基于 React的,而 React 是 Facebook 的用于构建 ...
- 分享 Ionic 开发 Hybrid App 中遇到的问题以及后期发布 iOS/Android 的方方面面
此篇文章主要整理了最近在使用 Ionic 开发 Hybrid App 过程中遇到的一些疑难点以及后期发布生成 iOS 和 Android 版本过程中的种种问题. 文章目录 Ionic 简介和项目需求介 ...
- Ionic开发Hybrid App问题总结
http://ionichina.com/topic/5641b891b903cba630e25f10 http://www.cnblogs.com/parry/p/issues_about_buil ...
- H5、React Native、Native应用对比分析
每日更新关注:http://weibo.com/hanjunqiang 新浪微博!iOS开发者交流QQ群: 446310206 "存在即合理".凡是存在的,都是合乎规律的.任何新 ...
随机推荐
- JavaScript入门培训材料(Copy至此以作备份)
JavaScript简明学习教程 2014年5月31日 目录 一.说明... 2 二.准备知识... 2 (一)HTML. 2 (二)DOM.. 3 三.JavaScript简介... 3 四.Jav ...
- 织梦DedeCms用SQL语句调用数据库任意内容方法
织梦DedeCms给我们提供了大量调用标签,供我们调用各种数据,但提供再多的标签,也有满足不了我们的时候,这时我们可以用SQL语句,灵活调用我们需要的内容. 如何任意调用数据库中的内容呢?先举个例子: ...
- c语言 函数传输传递的三种方式(值、指针、引用)
本文摘自<彻底搞定c指针> 一.三道考题开讲之前,我先请你做三道题目.(嘿嘿,得先把你的头脑搞昏才行……唉呀,谁扔我鸡蛋?)考题一,程序代码如下:void Exchg1(int x, in ...
- ssh事务配置
<!-- 配置业务层 --> <bean id="employeeService" class="cn.bdqn.jboa.service.impl.E ...
- input file美化
<style> a{display:inline-block; width:100px; height:40px; position:relative; overflow:hidden;} ...
- “System.Transactions.Diagnostics.DiagnosticTrace”的类型初始值设定项引发异常[WCF]
未处理System.TypeInitializationException HResult=-2146233036 Message=“System.ServiceModel.Diagnostics ...
- Entity Framework Repository模式
Repository模式之前 如果我们用最原始的EF进行设计对每个实体类的“C(增加).R(读取).U(修改).D(删除)”这四个操作. 第一个:先来看看查询,对于实体类简单的查询操作,每次都是这样的 ...
- zoj.3868.GCD Expectation(数学推导>>容斥原理)
GCD Expectation Time Limit: 4 Seconds Memory Limit: 262144 KB ...
- hibernate杂记
1.hibernate中get和load方法有什么不同? (1)执行get方法,会立即加载对象, 执行load方法,若不使用该对象,则不会立即执行查询操作. (2)load 方法可能会抛出 LazyI ...
- [BZOJ1163][BZOJ1339][Baltic2008]Mafia
[BZOJ1163][BZOJ1339][Baltic2008]Mafia 试题描述 匪徒准备从一个车站转移毒品到另一个车站,警方准备进行布控. 对于每个车站进行布控都需要一定的代价,现在警方希望使用 ...