Vue3 diff 算法

Vue3 源码方面

package - runtime - core - rander

patchChildrenFn - flag判断有没有 key - 两个方法一个是有 key 执行，另一个是没有 key 执行

没有 key 的方法 - 传进来两个数组 C1，C2,C1是旧的，C2 是新的 - 获取两个数组的长度 - 取最小值的数组 - 从0 位置开始比较 patch 操作 - 将 c 变成 f - 如果旧的比新的多，就把旧的 unmount，如果新的比较多，就把新的进行 mount

如果有 key 的方法

1. 从头部开始遍历 - while 循环 - 进行 isSameVNodeType判断- 不是同一类型进行 break

1. 从尾部开始遍历 - 不是同一类型进行 break

3、如果新的节点比较多 - 进行新增节点的挂载mount

4、如果旧的节点比较多 - 进行unmount

5、如果位置无序队列 - 尽可能在旧的节点里面找新的节点里面对应的相同 key 相同 type 进行 patch，如果旧的里面没有新的对应的就 unmount，新的里面有就 mount

Vue2 源码方面