当前位置: > > > React Native - 入门介绍(起源、特点、与其它移动技术的比较)

React Native - 入门介绍(起源、特点、与其它移动技术的比较)

1,起源

(1)Native App 优点是功能强大、性能优越。但终究是受制于苹果,而且多版本维护十分痛苦。

(2)为了不受苹果掌控,Facebook 曾花费大量的人力物力进行移动 HTML5 技术研发。虽然有些成果,但始终离 Native App 有差距,而且这个差距可能永远赶不上。

(3)2012年9月Facebook 方面承认“Betting on HTML5 was a mistake.”。便放弃移动 HTML5,全力转型 Native App 开发。

(4)在转型 Native App 开发后,Facebook 内部其实还在研发一种新的移动技术,并开始使用这种技术开发内部 App。这个技术便是 React Native

(5)2015年3月Facebook 正式公开发布 React Native,并将该技术开源。虽然当时开发平台仅支持 Mac OS,部署也仅支持 iOS 平台。

(6)2015年9月15日Facebook 发布了 React Native for Android,把 Web 和原生平台的 JavaScript 开发技术扩展到了 Google 的流行移动平台 Android 上。至此,React Native 实现了跨平台的特性。



2,React、React.js、React Native三者的联系

  • React 是基础框架,提供了一套基础设计实现理念。
  • React.js 是在 React 理念的指导下产生的专门用来开发网页的 web 前端框架。与 React 同时出现和发展,React 的相关概念都在 React.js 文档中。
  • React Native 是用来开发移动端 app 的。只不过是用了 React.js 那套模式,而底层是对 Native Code 的封装及调用。


3,React Native与其它移动技术的比较

React Native 出现前,我们通常会选择这三种移动技术(Native AppHTML5Hybrid)之一进行开发。
  • Native App:开发原生应用自然性能最好,功能强大。但多平台版本的开发、维护要花费大量的人力物力。
  • HTML5:虽然有 Web 的优势,即灵活的布局能力、免发版的敏捷迭代潜力、优秀的跨平台特性。在新闻资讯等一些强排版、弱交互的展示类 App 上大展拳脚。但由于 WebView 在移动设备上的性能制约,始终难成大器,这也是 Facebook 放弃其的原因。
  • Hybrid:以 CordovaPhoneGap)为代表的 Hybrid 方式集 Native App Web 优点于一体,使二者相互补短。
React Native 思想与上面三者都不一样。它的底层引擎是 JavaScript Core,但调用的是原生的组件而非 HTML5 组件。这样运行时可以做到与 Navive App 相媲美的性能体验,同时因为 JavaScript 代码可以使用后端强大的 Web 方式管理,既可以做到高效开发,也可以实现快速部署和问题热修复。


4,React Native的优点

(1)性能媲美原生应用
由于 React Native 提供的组件是对原生 API 的暴露。虽然我们是用 js 写的代码,但实际上调用的是原生 API,原生的 UI 组件。体验上足以媲美原生应用。

(2)开发效率高
相比于原生开发,js 学习成本低、语法灵活。允许让 Web 开发者更多地基于现有经验开发 App

(3)组件化开发
React 强调将应用划分成多个互不相关的组件,每个组件作为一个独立的视图。这种类似搭积木的开发方式使得代码结构清晰、通用性高、可移植性高。上一个项目的某些组件,可以很方便地拿来在下一个项目中使用。对于那些优秀的第三方组件,也能很方便地集成到我们项目中来。

(4)节约开发成本
百分之90多界面可以通过 React Native 开发,一份代码同时可以适配 Android iOS。并通过一些手段自动匹配不同屏幕大小的手机,再也不需要自己去计算视图的大小和位置。

(5)实时远程调试
React Native 的调试比 Cordova 不知道好到哪里去了。开启了实时重载之后,代码一改,app 就自动更新成最新,对于 UI 的搭建简直是省了不少的编译时间。同时可以打开 XCode 实时的看到所有的 log 信息。

(6)代码热部署
我们知道 AppStore 审核流程超级久。而由于 React Native 是用的 js 来写的代码,实时编译的过程能让我们实现应用像网页一样做到热更新,随时发布。真正能够做到上架审核一次,永久 0 审核更新。

(7)有效降低移动应用安装包体积
对于普通复杂度的移动应用,使用 React Native 实现的安装包会比原生代码实现的安装包大。而当移动应用功能越复杂,React Native 安装包体积相比原生代码安装包就越小。
比如当原生代码实现的安装包大于 15MB 时,使用 React Native 改写代码后,安装包就小于原生代码实现的安装包。
评论3
  • 3楼
    2017-07-24 17:17
    lhw

    以前跟你学swift,现在跟你学react,多谢航哥。

    站长回复

    欢迎欢迎,我也感谢你一直一来的支持。

  • 2楼
    2017-01-06 14:31
    macfai

    跟着航哥学习最牛逼的RN,航哥,希望持续更新哦,😄

    站长回复

    当然会的。

  • 1楼
    2017-01-03 20:07
    Zex

    站长现在自己的APP开发中是否已经大量使用React Native了?

    站长回复

    目前项目中还没有大量使用,主要用React Native开发一些个人的App。