如何看react源码
阅读React源码的方法
克隆React仓库
从GitHub克隆React的官方仓库，切换到稳定版本分支。React采用Monorepo结构，核心代码在packages/react和packages/react-dom中。
理解代码结构
重点关注react/src下的核心模块：React.js包含API入口，ReactHooks.js定义Hook机制，ReactElement.js处理元素创建。react-reconciler包实现Fiber架构。
调试工具配置 使用source-map-loader配合Webpack，或直接在浏览器调试打包后的开发版React。通过React DevTools的组件树定位具体实现代码位置。
核心模块分析
Fiber架构解析
从ReactFiber开头的文件入手，ReactFiberWorkLoop.js包含任务调度循环，ReactFiberBeginWork.js处理渲染阶段。Fiber节点结构定义在ReactInternalTypes.js。
事件系统
ReactDOMEventProperties.js注册事件类型，legacy-events文件夹包含合成事件实现。事件委托机制在ReactDOMComponentTree.js中处理。
Hooks实现
ReactFiberHooks.js是Hook核心，useState等具体实现在ReactHooks.js。注意dispatcher机制和currentDispatcher的切换逻辑。
辅助工具与技术
构建源码
使用yarn build命令生成带sourcemap的开发版本。--type=UMD参数生成浏览器可直接引用的版本。
测试用例参考
__tests__目录下的单元测试是理解功能的绝佳文档。例如ReactHooks-test.js包含各种Hook的边界用例。
调用栈分析
通过性能分析工具记录组件更新过程，结合源码中的__DEV__断言信息追踪执行路径。重点关注beginWork/completeWork的调用链路。
关键调试技巧
断点设置
在renderWithHooks函数设置断点观察Hook调用栈。在scheduleUpdateOnFiber打断点追踪更新发起过程。
最小复现 修改fixture中的示例代码，配合构建出的本地React版本验证理解。优先研究简单场景如函数组件状态更新。
版本对比 利用Git历史查看重要特性的演进，如Concurrent Mode的实现变化。注意major版本之间的架构差异。
