从零手写简化版React，涵盖Fiber架构、任务调度、Hooks原理、Diff算法和性能优化。用JSX和Vitest做测试驱动开发，最后完成TodoList项目。适合想深入理解React原理的前端开发者。

用了这么久React，有些问题一直没想明白：

useState调用后，React怎么知道该更新哪个组件？

Fiber架构到底解决了什么问题？

Diff算法遇到列表重排序时，具体是怎么处理的？

useEffect的清理函数在什么时机执行？

看官方文档只讲用法，看源码又太复杂。后来云栈社区找到这套课程，作者带着从头写了一遍Mini-React，把核心逻辑都实现了一遍。

本课程通过从零实现Mini-React框架，深度解析React核心架构设计。学员将亲手实现Fiber架构、任务调度器、统一提交机制、函数组件渲染、Hooks（useState/useEffect）、事件系统、Diff算法及性能优化等核心模块。课程采用JSX+Vitest测试驱动开发，涵盖异步任务批处理、内存泄漏防治、动态Props更新等企业级解决方案。通过完成TODOS实战项目，你将掌握React底层运行机制、性能优化技巧，并获得构建自定义前端框架的能力，彻底摆脱黑盒开发困境。

https://yunpan.plus/t/34

课程目录

第一部分 讲JSX解析和虚拟DOM的创建

第二部分 实现Fiber架构和任务调度

第三部分 处理函数组件和Props更新

第四部分 写Diff算法，包括各种边界情况

第五部分 实现useState的批量更新机制

第六部分 做useEffect和cleanup逻辑

最后用自己写的框架完成TodoList

每个模块都有单元测试，代码量不大但逻辑很清晰。跟着写完之后，再看React源码就能看懂大部分思路了。

对理解框架设计确实有帮助，分享给需要的朋友。