ReactDOM.render
内部调用了方法 legacyRenderSubtreeIntoContainer。该方法首先创建了一个 ReactRoot
实例,然后再在不同 情况下调用这个实例的 legacy_renderSubtreeIntoContainer
或 render
方法。
ReactRoot
的内部初始化了一个 _internalRoot
属性,这个属性是 ReactRoot
在实例化的时候调用 ReactFiberReconciler 模块下的 createContainer
方法创建的。
createContainer
在内部调用了 另一模块 的 createFiberRoot
方法,其返回值是一个 FiberRoot
。
ReactRoot
实例方法在内部调用了 updateContainer
方法
updateContainer
调用了 updateContainerAtExpirationTime
updateContainerAtExpirationTime
调用了 scheduleRootUpdate
scheduleRootUpdate
调用了三个方法:
- flushPassiveEffects
- enqueueUpdate
- scheduleWork
第三个 scheduleWork
方法开始调度工作了
scheduleWork
内部调用 requestWork
请求工作。
requestWork
调用 performWorkOnRoot
执行工作
performWorkOnRoot
调用 renderRoot
renderRoot
调用 workLoop
workLoop
循环调用 performUnitOfWork
performUnitOfWork
调用 beginWork