这门课解决什么痛点

很多前端开发者面临一个尴尬的处境：React 项目用了不少，但一旦遇到性能瓶颈或架构难题，往往只能依赖经验或搜索引擎，知其然而不知其所以然。市面上大多教程侧重 API 调用和组件封装，忽略了框架底层的设计逻辑。这门课程的核心价值在于，它不只教你怎么用 React，而是带你亲手造一个 React。通过从零开始实现 React 18 的核心模块，你将厘清虚拟 DOM、 Fiber 架构、调度器以及并发渲染等关键概念的底层原理。

课程特别强调真实性与严谨性，项目跑通的是 React 官方的单测用例。这意味着你的实现不仅要在逻辑上自洽，还要通过官方严苛的测试标准。这种“原汁原味”的开发体验，能有效填补理论学习与工程实践之间的鸿沟，帮助开发者从底层视角重新理解 React 的工作机制，从而在日常开发中做出更优的技术选型和性能优化决策。

适合什么基础，建议先看哪几块

本课程适合已经熟练掌握 React 基础 API，并有一定 JavaScript 原生功底（如 ES6+、闭包、异步编程）的前端开发者。如果你对 React 只是停留在使用层面，缺乏对 Hooks 原理、状态管理机制的深入理解，或者正在准备大厂高阶岗位的面试，这门课非常合适。具备 Vue 等其他框架背景但希望深入理解现代前端框架共性思想的开发者也可尝试。

建议学习顺序如下：首先从基础的环境搭建和项目结构入手，理解整体架构；接着重点攻克虚拟 DOM 的创建与 diff 算法，这是理解 React 性能优化的基石；随后深入 Fiber 架构和调度器机制，把握 React 18 并发特性的核心；最后结合 Hooks 的实现原理，串联起整个状态管理的脉络。理论部分配合日常开发中的实际场景进行复盘，效果更佳。

学完能独立做什么，资料如何配合练习

完成本课程后，你将能够独立解读 React 源码的核心逻辑，不再畏惧复杂的状态管理和性能问题。你能够基于对底层原理的理解，自定义高阶组件、优化渲染性能，甚至根据业务需求裁剪或扩展框架能力。更重要的是，你将建立起系统化、工程化的前端思维体系。

在练习方面，建议边看视频边动手编码。不要直接拷贝代码，而是尝试先自己实现核心逻辑，再对照视频修正。资料包中提供的测试用例是检验成果的唯一标准，务必确保每一阶段的代码都能通过对应的单测。遇到报错时，先利用断点调试定位问题，再回头查阅相关理论章节，这样能将知识点记得更加牢固。同时，建议将实现过程中的难点记录下来，形成自己的知识库，便于日后查阅和复习。

课程目录

├── [9.8M] 0 课程介绍.mp4
 ├── [ 55M] 1-1 搭建项目架构.mp4
 ├── [155M] 2-1 实现JSX.mp4
 ├── [ 74M] 2-2 JSX转换—实现JSX的打包.mp4
 ├── [ 28M] 2-3 JSX转换—实现第一种调试方式.mp4
 ├── [ 98M] 3-1 初探Reconciler.mp4
 ├── [ 33M] 4-1 如何触发更新—实现状态更新机制.mp4
 ├── [ 86M] 4-2 如何触发更新—接入状态更新机制.mp4
 ├── [175M] 5-1 实现首屏渲染.mp4
 ├── [ 67M] 5-2 初探mount流程—实现completeWork.mp4
 ├── [187M] 6-1 初探ReactDOM.mp4
 ├── [ 52M] 6-2 初探ReactDOM—实现Mutation子阶段.mp4
 ├── [ 72M] 6-3 初探ReactDOM—实现ReactDOM.mp4
 ├── [ 39M] 6-4 初探ReactDOM—调试ReactDOM.mp4
 ├── [ 64M] 7-1 初探FC与实现第二种调试方式.mp4
 ├── [ 35M] 7-2 初探FC—实现第二种调试方式.mp4
 ├── [143M] 8-1 实现useState.mp4
 ├── [ 79M] 8-2 实现useState—实现useState.mp4
 ├── @更多it资源关注www. ├── [ 39M] 9-1 ReactElement的测试用例.mp4
 ├── [ 71M] 9-2 ReactElement的测试用例—测试ReactElement.mp4
 ├── [ 76M] 10-1 初探update流程.mp4
 ├── [ 54M] 10-2 初探update流程—处理commit阶段.mp4
 ├── [ 95M] 10-3 初探update流程—处理useState.mp4
 ├── [107M] 11-1 实现事件系统.mp4
 ├── [ 32M] 12-1 实现Diff算法—单节点Diff.mp4
 ├── [105M] 12-2 实现Diff算法—多节点Diff.mp4
 ├── [ 54M] 12-3 实现Diff算法—处理commit阶段.mp4
 ├── [127M] 13-1 实现Fragment.mp4
 ├── [ 47M] 14-1 批处理的概念.mp4
 ├── [ 49M] 14-2 实现Lane模型.mp4
 ├── [ 57M] 14-3 实现调度阶段.mp4
 ├── [ 76M] 14-4 改造更新流程.mp4
 ├── [ 98M] 15-1 实现useEffect数据结构.mp4
 ├── [190M] 15-2 实现useEffect工作流程.mp4
 ├── [133M] 16-1 实现noop-renderer.mp4
 ├── [ 55M] 16-2 打包noop-renderer.mp4
 ├── [ 57M] 16-3 测试useEffect.mp4
 ├── [ 56M] 17-1 实现同步更新Demo.mp4
 ├── [117M] 17-2 实现并发更新Demo.mp4
 ├── [ 52M] 18-1 实现并发更新的交互部分.mp4
 ├── [114M] 18-2 实现并发更新的策略逻辑.mp4
 ├── [205M] 18-3 实现并发更新的状态计算.mp4
 ├── [ 29M] 19-1 useTransition的作用.mp4
 ├── [109M] 19-2 实现useTransition.mp4
 └── [118M] 20-1 实现useRef.mp4