React与React Native的异同

开发React一段时间了，一直没有搞清楚React和React Native的差异。今天特意去了解下，发现差异还真不小！

相同点：

1.都是Facebook公司推出的框架。

2.都是基于JSX语言开发的。

差异点：

1、作用的平台不同.

2、工作原理不同.

3、渲染周期不同.

4、组件构成形式不同.

5、宿主平台的API不同.

1、作用的平台不同

React，其实准确的说应该是React Web.是基于Web开发的一个框架。具体来说，就是在PC电脑上以浏览器为渲染平台。

React Native，简称(RN)， 是在React基础上衍生出来的。是基于移动平台（iOS和Android）的框架。主要适配于手机端页面。

2、工作原理不同

学React，第一个要明白的概念就是虚拟DOM（是介于真实DOM与Web页面之间的联系）。主要作用是提供渲染的性能（通过Diff差异，减少刷新次数）。Facebook在React框架上，创新之一就是引入虚拟DOM，提高了系统性能。

React Native的工作原理，就是调用原生API去渲染界面。具体就是使用Objective-C的API去渲染iOS组件，或者使用Java API去渲染Android组件。在这里就没有DOM的概念，而是桥接原生组件。

React组件通过render方法返回了描述界面的标记代码。React最终把标记代码解析成浏览器的DOM；

而在React Native中，标记代码会解析成特定平台的组件，如<View>会表现成iOS平台上的UIView。

3、渲染周期不同

React的渲染周期开始于react组件挂载到DOM之后，接着React进入渲染周期并根据需要渲染组件。在渲染阶段，React将开发者在return中返回的HTML标记直接按需渲染到页面上。

React Native 在渲染上直接依赖于桥接，所以可以不在UI主线程运行，它可以在不影响用户体验的前提下执行异步操作。

4、组件构成形式不同。

React，主要是使用JSX进行开发，最终会转变成JavaScript语言和HTML元素。在界面上以普通的HTML元素进行渲染。所以React，归根结底就是HTML元素的渲染。

React Native，所有元素都会被平台指定的React组件替换，例如在iOS中，<View>组件被渲染成UIView，而在Android平台，会被渲染成View。所以React Native就是平台组件的渲染。

5、宿主平台API不同

在React中，通常要处理浏览器标准的不一致和碎片化所引起的问题。通俗地讲：就是浏览器兼容性问题。

而React Native，取决于移动平台的支持组件的特性。默认情况下，iOS 和Android 版本的React Native 支持许多常用的特性。

同时平台特定的API 在提供原生的用户体验方面发挥了巨大的作用。所以在性能方面，更加接近于原生开发。