React15架构结构分为两层：

Reconciler（协调器）：负责找到变化的组件
Renderer（渲染器）：负责将变化的组件渲染到页面上

Reconciler（协调器）

在react中，可以通过this.setState、this.forceUpdate、ReactDom.rander等api触发更新。
每当有更新组件时，Reconciler会做如下工作：

• 调用函数组件或class组件的render方法，将返回的jsx转成虚拟DOM
• 将虚拟Dom与上次更新的虚拟Dom对比
• 通过对比找出本次更新中变化的虚拟Dom

• 通知Render将变化的虚拟Dom渲染到页面上

  Renderer（渲染器）

  由于React支持跨平台，所以不同平台有不同的Renderer。

• 浏览器环境渲染的Renderer -ReactDOM

• ReactNative 渲染APP原生租金
• ReactTest 渲染纯js对象用于测试
• ReactArt 渲染Canvas、SVG

每次更新发生，Renderer会接收Reconciler通知，将变化的组件渲染到当前宿主环境上。

React15架构的缺点

在Reconciler中，mount的组件调用mountComponent，update组件调用updateComponent，这两个方法都会递归更新子组件。
递归更新的缺点：一旦更新开始，中途无法中断，如果层级很深，就可能超过16ms，用户交互就产生卡顿。
乘法例子：

Reconciler和Renderer是交替工作的，当第一个li在页面上已经变化后，第二个li再进入Reconciler。
整个过程都是同步的，无法实现react快速响应的结果。
模拟中断：

当第一个li完成更新时中断更新，即步骤3完成后中断更新，此时后面的步骤都还未执行。