React 整体构建流程分析

这是关于自己记录学习 React 源码的系列文章之一

React 是我工作中常用的前端框架之一，现在已经发布了 18.2.0 版本，用它开发了很多项目，写了很多很多组件，既然每天和它打交道，便有了学习下 React 源码的想法，然后我按照官网的贡献流程这一章节，同时也在掘金阅读一些关于源码解读的文章帮助自己理解，就这样开启了我的 React 源码学习之路。

核心目录结构

React 的源码核心部分实际上分为 react、react-dom、react-reconciler、scheduler、share，也是在我学习过程中重点研究的内容。

整体构建流程

React 的整体构建流程分为以下几个阶段

• initialize 阶段：调用 createRoot 创建 FiberRootNode 以及 uninitializedFiber
• scheduler 阶段：根据任务的优先级调度任务，高优级别的任务进入下一阶段
• reconciler 阶段：组件 diff 的核心逻辑，找出组件更新前后的变化，打上相应的标记
• commit 阶段：更新对应的 dom，执行组件的生命周期，渲染页面

总结

本文是我学习 React 源码的第一篇文章，先写个自己理解的整体概述，后续会分析其中各个阶段的细节内容，同时欢迎在评论区写出你的看法以及指出我在学习源码过程中理解的错误。