前言在过去的一个多月里，为了更深入的学习，使用React，了解React的内部算法和数据结构，以及我自己，写了一个来自的玩具划痕框架。到今天终于可以出第一个版本了，因为就在昨天，跑完了之前的一个小项目。预览地址：动态简历luy版仓库地址：喜欢就给个star吧~框架地址：Luy真的是白手起家吗？其实不是，我没有重新发明jsx解析器，我是用官方的解析器帮我解析jsx的。当我正式开始写Luy时，我非常盲目和恐惧。原因如下。虽然我们都知道React是基于虚拟DOM进行渲染的，但是虚拟DOM到底是什么？它是如何工作的React的setState是异步的，这一点我们都知道。但是他的异步和setTimeOut一样吗？内部是用setTimeOut实现的吗？React的事件合成系统。在React官方中，几万行代码中几乎有40%用于模拟事件。这部分是如何实现的？你为什么这么做？为什么React列表中的key如此重要？虚拟DOM的优化策略是什么？带着这些疑问，我要么看源码，要么找文章，但要真正理解这些知识，可能还得自己实践一下，才能安心。制作这个玩具框架有很多问题吗？虽然现在有很多类React框架，每个人都想做自己的迷你解决方案，但要创建一个类React框架还是超级难的。可想而知，FB工程师一开始是没有React的，如何制作React，天才。源码分析不多，也不完整：很多号称分析React源码的文章，其实只是很浅薄的阅读。基本套路是，看到代码的地方，网帖变成文章，很多知识点还是要打断亲自调试才能知道React正式版。好文章往往只关注一两点，知识点需要慢慢拼凑：网上有很多好文章，但好文章不能面面俱到。比如有人研究setState，有人研究生命周期函数，有人也研究ref，甚至有人研究Vdom。这些知识点比较分散，很难拼凑起来。基本上理解一个知识点需要一两天的时间。虚拟dom算法：说实话，虚拟DOM的算法并不难，就是树的递归遍历，边创建边遍历比较。但令人惊奇的是，市面上出现了一堆虚拟DOM产品。虽然大体相同，但有些地方还是不一样的，后面会讲到。榜单重点：虚拟DOM算法中最难的部分。对应的实际场景如下：
