传统Diff算法

传统Diff算法使用的是循环递归每一个节点，不区分层级

即顶层节点循环遍历新vnode的每个节点，这样会导致复杂度能达到O(n^3)

Vue的Diff算法（Vue2.0）

vue的diff算法使用了patch函数，类似打补丁

使用的是4指针算法，在新旧节点头尾定义指针位置进行遍历

ps：Vue3.0的diff算法借鉴了ivi算法和inferno算法

React的Diff算法

react的Diff算法，将节点分为三种

1.tree diff

对整个树结构进行分层处理，同一层级的节点对比，不存在则删除，跨层的节点因为分开同层级对比，所以将一个节点从第二层移动到第三层的一个简单操作，可能触发删除新增两个操作

2.component diff

如果是同类型的组件，则进行element diff，如果不是同类型的组件，则会直接替换掉子组件

3.element diff

元素对比分为使用key和不使用key的情况

不使用key的情况下，对节点会产生删除新增操作

使用key，则会对新集合进行遍历，判断是否存在老节点，减少了删除新增的操作

参考：

聊一聊Diff算法（React、Vue2.x、Vue3.x） – 知乎