详细概括 React 新版本（16）初始渲染流程

核心过程：JSX -> babel -> createElement -> ReactElement -> render -> workInProgress Fiber -> commit -> getSnapShotBeforeUpdate -> dom ->lifeCircle/hook

逻辑细节：

1. jsx 转换成 react 元素

• babel-react 会将jsx 调用 React.createElement
• React.createElement 会 jsx 转换成 react element （react element 就是 一个用来描述react 元素的对象。）

2. render （协调层）此阶段负责创建 Fiber 数据结构并为 Fiber 节点打标记，标记当前 Fiber 节点要进行的 DOM 操作。

       首先为每一个react 元素构建 fiber 对象 (workInProgress Fiber 树）创建 此 fiber 对象对应的 DOM 对象，为 fiber 对象添加 effectTag 属性（用来记录当前 Fiber 要执行的 DOM 操作），然后在render 结束后， fiber 会被保存到 fiberroot 中。

代码层步骤：

• 将子树渲染到容器中 (初始化 Fiber 数据结构: 创建 fiberRoot 及 rootFiber)
• 判断是否为服务器端渲染 如果不是