React Native 原理

React Native简介

React Native是一个创建在JavaScript和React上用于构建本地应用的框架,它具备React和JavaScript类似的代码风格，编写一次能够运行在多个平台之上（>= Android 4.1 (API 16) and >= iOS 8.0），而且有着强大的社区。

React Native 结构

主要分为三个部分：

• Native Code对应着原生代码，例如android的原生Java代码，ios的原生C++代码

• Bridge用于将JS和原生Native Code链接起来

• JS VM用于运行JS代码，React Native采用的是JavaScriptCore,在Android上，须要应用本身附带JavaScriptCore，Ios上JavaScriptCore属于系统的一部分，不须要应用附带。

React Native线程模型

React Native应用中存在三个线程队列，它们工做的流程大概以下：UI Event Queue触发事件，经过Bridge调用JS代码在JS Event Queue中运行，JS运行后将视图更新分发给Native Module Event Queue中的线程,Native Module Event Queue负责计算，而后将最后的结果交给UI Event Queue中的线程去更新。 其中UI Event Queue为主线程。

Modules

React Native中有一个基本的概念就是模块，一个模块有状态和方法，咱们能够经过JS调用一个Module,如上图中以Android为例，能够经过JS调用Dialog module,而后转化成原生代码对应的是Android中的DialogModule。

View Managers

React Native中的另外一个概念是组件，一个组件能够经过映射关系和原生的API相对应，咱们也能够自定义组件，例如上图中的<Text/>和原生代码中的 new TextView(getContext())相对应。

JavaScript对象和原生代码交互

JavaScript对象能够和原生对象之间相互调用，关系如上图。

JavaScript和本地代码间的通讯

其中通讯的特色是：

• 异步的

• 序列化的

• 批量的，对于大批量的通讯事件能够将其分红几部分，减小时间延迟

参考：http://www.reactnative.com/un...