react源码解析——ReactDOM.render

react创建更新的方式由三种

1. ReactDOM.render
2. setState
3. forceUpdate

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(<App />, document.getElementById('root'))

ReactDOM.render 是 React 程序的起点。

1 render 接受三个参数，第一个参数是ReactElement，第二个参数为组件所要挂载的DOM节点，第三个参数为回调函数。

2目的是为了创建root对象 此函数主要作用通过legacyRenderSubtreeIntoContainer 函数第一个入参 parentComponent 是写死的 null，函数首先生成了一个 root 对象， 调用的方法是 legacyCreateRootFromDOMContainer。 注意初始化的mount并不是批量的 而是立即完成
这一个root实际是createContainer方法的调用
这个函数方法很关键会去执行createFiberRoot，一步一步创建fiber对象

注意
首先，初始化fiber对象上的updateQueue，没有的话新建一个，然后将这个update放到updateQueue中，其中让人迷惑的点在于为什么有两个queue，以及alternate的作用，简单来讲，在Fiber树更新的过程中，每个Fiber都会有一个跟其对应的Fiber， 我们称他为current <==> workInProgress，在渲染完成之后他们会交换位置，这样就保证了更新过程中Fiber本身不变，两个queue也就这么产生了。
React 将更新放到了Fiber队列中，接下来就是使用scheduleWork来进行调度了，这个后续章节讲。