本文是单个学习中差异算法的记录。它主要讨论VUE2和VUE3DIFF算法的核心部分中的代码和实现过程。
差异算法的使用应从VUE框架的设计开始。从范式的角度来看，该框架可以用作命令或声明，权衡VUE的性能和维护以选择声明性设计方案。
命令：代码本身描述了“做事的过程”。在制定代码期间，我们需要维护实现目标的整个过程，包括手动完成创建，更新，删除等。声明：更加关注结果，代码显示是我们想要的结果，它看起来更直观，因为做事的过程，我们不需要关心它。您可以从上方看到语句样式。维护性高于命令类型，心理负担小于命令类型，但性能比命令类型差。命令代码的更新性能消耗=性能消耗直接修改，声明公式=直接修改 +找到性能消耗的差异。因此，只要我们可以最大程度地降低差异的性能，我们就可以无限制地接近命令。将使用虚拟DOM和DIFF算法
虚拟DOM是代表真实DOM的对象。VUE通过模板编译虚拟DOM树，然后通过渲染器渲染到真实的DOM中。当数据更新后，生成了新的虚拟DOM树。它不是生成真实DOM.的最佳方法。在进一步降低差异性能的性能消耗时，必须使用DIFF算法。DIFF算法IS比较algorithm.com与旧的虚拟DOM和新虚拟DOM进行比较，比较虚拟节点更改，找出此虚拟节点，并且仅更新与虚拟节点相对应的真实节点，以实现准确更新真实的DOM。
注意：下图中的A，B和C是节点的钥匙值。所有移动插入和删除操作都在实际DOM中。以下是差异算法的核心部分
VUE2使用双端差异算法。核心方法是Updatechildren，在五个搜索中可以通过新的和旧的前线，新旧，新旧，新旧，旧，新旧，旧，新，新的，新的，新的。：所有未在newchildren中处理的最初节点新节点新节点：纽children旧前节点的所有最后一个节点：OldChildren Old Old的所有第一个节点
在特定介绍之前，我们还需要了解Issamevnode的方法以比较两个节点是否相同
与旧的和旧的前部相比，如果相同，则旧的开始后返回到一个。上图中的新旧节点是相同的，并且位置的位置被移动。在这个与古老的时间相比
与旧帖子和旧帖子相比，如果相同的新帖子，则竞标将在旧的末端向前移动。上图中的新旧节点是相同的，并且位置的位置被移动。目前，新节点是B。两个节点不同。这是不同的。这是不同的。当我发现新的和古老的老古老时，新的和古老的人都不满意。
与旧的前部和旧的相比，如果是相同的话，旧的启动节点在旧端节点后面移动，然后旧的开始向后移动，而新的结局将向前移动。这次，我发现这三个新职位的类型无法满足。
与旧的和旧的和旧的相比，如果相同，旧的端节点将移至旧启动节点的前节点，然后将新的启动标记并向后移动。
如果比较节点时不适用上述4种方法，目前我们只能使用最暴力的方法。首先，我们需要循环旧子来生成映射表的总和。中间，如果找到它，可以将节点移至最前沿，并将原始位置移至最初的位置，以防止崩溃的阵列防止来自旧节点移开了。
有时我们添加新数据。周期结束后，纽童具有尚未处理的其余节点。我们需要循环这些节点，然后一个一个一个插入它们。如图所示，在此时间，新的子节点也具有C，D的两个节点，并且需要插入这两个节点。
另一种情况是，当我们删除元素时。目前，在比较周期结束后，老童的剩余节点尚未处理。我们需要循环这些节点，然后一一将它们删除。如图所示，在此时间，旧的子节点和c，d两个节点是冗余的，并且在循环中删除了这两个节点。
注意：下面提到的DIFF算法是VUEJS设计和开发书的版本，该版本与源代码版本不同，但核心部分是相同的。您可以转到Mini-Vue查看源代码版本
使用VUE3。核心方法是从纯文本差异算法中的预处理想法中学习，以处理两个新组和旧组节点中的相同前节点和后节点。处理后，如果其余节点不能简单地安装新节点，或卸载不再存在以完成更新的节点，您需要根据节点的索引关系构建最长的后续顺序。指向后续序列最长的节点是不需要移动的节点。
前节点的处理由变量定义，指向新的两个组节点，它们相对较新。旧节点是否相同。
后节点的处理是索引旧端的最后一个节点的最后一个节点和索引，以列为旧节点到新的sub -nodes的最后一个节点。然后比较指向的两个旧节点，如果相同的方向，直到两个节点不同，结束后节点的处理
当我们处理相同的前节点和后节点时，如果剩余的节点，我们必须处理剩余的节点。
仅留下一组新的子节点
当满足条件时，这意味着只有一组新的子节点和不合理的节点。我们需要周期中的节点来插入
只有旧的子节点有剩余
当满足条件时，这意味着只有一组子节点和不合理的节点。我们需要在周期中删除节点
新旧组的子节点在此状态下具有其余内核：该状态的主要核心：构建一个源数组来存储新的sub节点集，每个节点的每个节点在旧组中（索引）。定义剩余新节点的长度长度的数组。初始值是初始值。它还定义了一个用于录制的变量，然后穿越了一组新的子节点，构建和映射表，最后将旧的节点横穿到旧的节点。对于组节点，在映射表中找到。如果找到它，则可以将相应索引存入相应的位置。没有人发现节点是冗余并直接删除的。
要确定是否移动节点，我们在主页上定义了两个变量以记录需要移动的值，并记录新内部的最后一个节点的索引。不需要移动，否则
使用最长的后续序列来优化运动逻辑。如果首先通过最长增加的后续序列获得生物列表，然后从背面遍历一组新的节点。无需移动，否则您需要移动。
VUE2是全数差异，VUE3使用静态标记，仅标签的节点为diff
将VUE2中的虚拟DOM与全量进行比较。运行时，它将为所有节点生成一个虚拟节点树。当页面数据更好时，它将穿越虚拟DOM的所有节点（包括一些不变的节点）。变为；VUE3与DIFF算法中的VUE2相比添加了静态标记。编译模板时，编译器将在动态标签的末端添加/文本/ patchflag。也就是说，当生成Vnode时，同时将标记它。在补丁过程中