• ReactNative调研结果


    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书写并完成升级。

    相关的工作量包括:

    1.  使用JS开发React Native
    2.  React Native与Native代码结合
    3.  跨平台、性能等方面的测试
    4.  自动升级功能的测试

     

    七.对安卓的支持程度

    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性能相关

     
  • 相关阅读:
    Notification 通知
    首次在MI5手机上看到APP界面 ~
    Installation falied with message Failed to establish session.
    adb.exe 已停止工作
    内容提供器(Content Provider)
    Android 数据存储
    RecyclerView
    UI设计 四种基本布局
    关于Android教学的思考1
    Android 主要控件
  • 原文地址:https://www.cnblogs.com/alexjie-123/p/6096591.html
Copyright © 2020-2023  润新知