前端面试题 vue中diff算法原理

Vue2 diff原理

1. Diff 算法是同级比较，内部是深度优先遍历节点
2. 判断节点是否同一个元素，如果是对比属性对比孩子节点，如果不是直接删除老的替换新的。
3. Vue2采用了双指针对一些场景做了优化策略（静态节点可以直接掉过diff）

对头头，尾尾，头尾，尾头进行了优化

4）最后根据老节点创造了一个映射表，用新的去里面找能复用就复用

Vue3 diff 原理

1. Vue3 有一个blockTree概念，如果是通过模板编译的，会把dymanicChildren组成数组直接数组对比，性能更优，如果不能使用这用方式采用全量对比如（v-for）
2. Vue3优化移动节点的时候 采用了最长递增子序列来实现，贪心+二分查找+前驱节点实现O(nlogn)