React Native相关调研总结
一.概要
React Native - 使用React开发世界一流的原生应用;
使用JavaScript和React(对JS有一定扩展)作为开发语言;
React Native专注于夸平台的开发效率,一次学习,跨平台应用(支持安卓和iOS)。
二.集成步骤
1.前往https://nodejs.org/en/下载node.js的pkg并进行安装
2.前往https://github.com/facebook/react-native下载最新版React Native(0.31)
3.解压并执行npm install命令
4.新建Xcode工程,在工程中按照需引入React Native的库(存在于Libraries目录)
5.完成React Native集成
三.对App体积的影响
1.包含模拟器和真机版本的静态库体积总共约30M
2.生成AppDemo只使用基本的类,ipa大小是1.7M
四.性能
官方宣称有媲美原生代码的性能,但是有网友提出React Native的性能并不理想,在页面层级到达5的时候,就要进行代码优化了。
五.动态升级方案
React Native本身并没有动态升级相关的管理类,但由于React Native使用Javascript进行构架,使得动态升级变的很方便;
关键步骤为:
1. 检查某页面对应JS是否有更新
2. 如果有更新,Native代码则进行下载
3. 下载完毕后,覆盖老版本JS
4. 重新从JS初始化RCTRootView,并加入到界面中
5. 完成升级
六.大模块升级开发成本
目前来看,React Native中提供基础的UI控件、动画、HTTP/HTTPS请求、socket、持久化等组件,理论上来讲一个模块或界面包含的所有内容,都可以使用React Native书写并完成升级。
相关的工作量包括:
- 使用JS开发React Native
- React Native与Native代码结合
- 跨平台、性能等方面的测试
- 自动升级功能的测试
七.对安卓的支持程度
React Native支持Android4.1及以上,iOS7.0及以上系统
八.使用难度
1.需要有JS语言基础
2.需要对React有基本概念,如JSX、components、state和props
3.对于一个JS工程师,门槛是比较低的
九.总结
优势:
1. 一定程度的跨平台,一些组件在不同平台还是有着细微差异;
2. 提供了相对丰富的组件,包括UI控件、动画、HTTP/HTTPS请求、socket、持久化等等组件;
3. 有相对成熟的升级方案;
4. 对于APP体积影响不大。
劣势:
1. React Native并不像JSPatch、WaxPatch等提供脚本语言到Native代码的一对一的映射关系,它只是提供了一系列组件,在构建复杂界面时会存在一些困难;
2. 性能方面不如Native代码,在多层页面叠加时可能会出现明显性能问题;
3. 需要学习JS语言。
十.参考资料
https://facebook.github.io/react-native/docs/tutorial.html
http://blog.csdn.net/linshaolie/article/details/50961955 React Native的动态更新方案
http://www.tuicool.com/articles/BJ7JbaY 用React Native实现动画
http://blog.csdn.net/u010046908/article/details/50916511 使用React Native进行HTTP请求
http://facebook.github.io/react-native/docs/integration-with-existing-apps.html 在已有native app中集成React Native页面
http://www.tuicool.com/articles/biUNriA React Native性能相关