hushicai
commented
4 years ago Dan Abramov建议我们阅读以下文件来深入理解React：
- ReactFiberBeginWork (“entering” a component)
- ReactFiberCompleteWork (“leaving” a component)
- ReactFiberCommitWork (flushing changes to DOM)
- ReactFiberScheduler (choosing next component to work on)
- ReactChildFiber (diffing insertions/deletions of children)
React的代码量是毋庸置疑地庞大。
特别是React 16以后，Fiber架构还是有点晦涩的，如果盲目阅读，最终可能会无疾而终。
本文主要介绍如何有条不紊地开始阅读React源码。
前置条件
看源码之前需要对项目的原理有一个基本的了解。
磨刀不误砍柴工！
对于React，我们需要先熟悉一下Fiber架构，推荐以下资源：
以上都是React Core Team分享的干货，一线资料，非常值得看。
当然React官方文档、React官方博客、网上也有很多干货，也可以多看看。
官方指引
大型开源项目通常都有官方指引。
在开始读源码之前，阅读官方指引，通常可以为我们指明方向。
例如React Contribute Guild中就有一段很明显的描述：
React官方建议我们从
fixtures/packaging/babel-standalone/dev.html开始玩，那我们就从这里开始！问题导向
阅读源代码，最好不要为了阅读而阅读，带着目的去阅读，可能会事半功倍。
例如，我们想要了解
ReactDOM.render的工作原理，那么我们就可以找到ReactDOM.render方法，在那里打个断点，然后运行例子，一步步调试进去看看发生了什么事。打断点：
更新依赖
重新build：
运行例子:
一步步调试：
结合一步一步的代码调试，我们可以看到框架的函数调用栈。
先了解一下调用栈，再对于每个重要的函数深入研究。
关注核心开发者
React Core Team在twitter上很活跃，经常会在Twitter上面讨论一些高质量的话题，关注一下，会有不少收获：
此外，Dan Abramov最近还开了一个博客，上面的文章质量也很高，推荐订阅。
参考文章