在新老虚拟DOM对比时：

  • 首先，对比节点本身，判断是否为同一节点，如果不为相同节点，则删除该节点重新创建节点进行替换
  • 如果为相同节点，进行patchVnode，判断如何对该节点的子节点进行处理，先判断一方有子节点一方没有子节点的情况(如果新的children没有子节点，将旧的子节点移除)
  • 比较如果都有子节点，则进行updateChildren，判断如何对这些新老节点的子节点进行操作（diff核心）。
  • 匹配时，找到相同的子节点，递归比较子节点

在diff中，只对同层的子节点进行比较，放弃跨级的节点比较，使得时间复杂从O(n3)降低值O(n)，也就是说，只有当新旧children都为多个子节点时才需要用核心的Diff算法进行同层级比较。

diff 算法具体流程

  • 同步头节点
  • 同步尾节点
  • 添加新的节点
  • 删除多余的节点
  • 处理未知子序列
  • 移动子节点
    • 建立索引图
    • 更新和移除旧节点
    • 移动和挂载新节点
    • 最长递增子序列