《手写 React 源码》
深入理解 React 源码,手把手带你构建自己的 React 库。
- 1. 项目框架搭建
- 2. 实现 JSX
- 3. 实现 Reconciler
- 4. 实现更新机制
- 5. 实现 Render 阶段
- 6. 实现 Commit 阶段
- 7. 实现 ReactDOM
- 8. 实现 useState
- 9. 接入测试框架
- 10. 实现单节点 update
- 11. 实现事件系统
- 12. 实现 Diff 算法
- 13. 实现 Fragment
- 14. 实现同步调度流程
- 15. 实现 useEffect
- 16. 实现 Noop Renderer
教程地址:https://2xiao.github.io/my-react
源代码地址:https://github.com/2xiao/my-react
使用 Git Tag 划分迭代步骤,手把手带你实现 React v18 的核心功能。
欢迎「Star ⭐️ 」 和 「Fork」,这是对我最大的鼓励和支持。
-
教程详细,带你构建自己的 React 库;
-
功能全面,可跑通官方测试用例数量:34;
-
按 Git Tag 划分迭代步骤,记录每个功能的实现过程;
React 是由卓越工程师们在数年时间内精心打造的库,其中必定蕴含了许多值得借鉴的经验和智慧。
如果你渴望更进一步,不仅仅停留在 API 的使用层面,而是追求更深入前端技术的探索,那么掌握 React 源码将成为你技能提升的极佳途径。
本书遵循 React 源码的核心思想,通俗易懂的解析 React 源码,带你从零实现 React v18 的核心功能,学完本书,你将有这些收获:
- 面试加分:框架底层原理是面试必问环节,熟悉 React 源码会为你的面试加分,也会为你拿下 offer 增加不少筹码;
- 提升开发效率:熟悉 React 源码之后,会对 React 的运行流程有新的认识,让你在日常的开发中,对性能优化、使用技巧和 bug 解决更加得心应手;
- 巩固基础知识:学习本书也顺便巩固了数据结构和算法,如 reconciler 中使用了 fiber、update、链表等数据结构,diff 算法要考虑怎样降低对比复杂度;
本书是基于 《从 0 实现 React18》 整理创作的,视频教程的作者是 @卡颂 。
本作品采用 知识署名-非商业性使用-禁止演绎 (BY-NC-ND) 4.0 国际许可 协议 进行许可。
只要保持原作者署名和非商用,您可以自由地阅读、分享、修改本书。