学习vue3 第二章（虚拟DOM）

对虚拟DOM的理解

虚拟DOM就是用JS对象来表述DOM节点，是对真实DOM的一层抽象。可以通过一些列操作使这个棵树映射到真实DOM上。

如在Vue中，会把代码转换为虚拟DOM，在最终渲染到页面，在每次数据发生变化前，都会缓存一份虚拟DOM，通过diff算法来对比新旧虚拟DOM记录到一个对象中按需更新，最后创建真实DOM，从而提升页面渲染性能。

虚拟DOM就一定比真实DOM快

虚拟DOM不一定比真实DOM更快，而是在特定情况下可以提供更好的性能。

在复杂情况下，虚拟DOM可以比真实DOM操作更快，因为它是在内存中维护一个虚拟的DOM树，将真实DOM操作转换为对虚拟DOM的操作，然后通过diff算法找出需要更新的部分，最后只变更这部分到真实DOM就可以。在频繁变更下，它可以批量处理这些变化从而减少对真实DOM的访问和操作，减少浏览器的回流重绘，提高页面渲染性能。

而在一下简单场景下，直接操作真实DOM可能会更快，当更新操作很少或者只是局部改变时，直接操作真实DOM比操作虚拟DOM更高效，省去了虚拟DOM的计算、对比开销。

diff算法

diff的目的是找出差异，最小化的更新视图。 diff算法发生在视图更新阶段，当数据发生变化的时候，diff会对新旧虚拟DOM进行对比，只渲染有变化的部分。