diff算法

一、传统diff算法[虚拟DOM中的diff算法]

查找两颗树每一个节点的差异

二、Snbbdom: 根据DOM的特点对传统的diff算法做了优化

1、DOM操作时候很少会跨级别操作节点

2、只比较同级别的节点

三、Snbbdom执行过程：在对开始和结束节点比较的时候，总共有四中情况

1、oldStartVnode/newStartVnode (旧开始节点/新开始节点)

如果新旧开始节点是sameVnode(key和sel[标签]相同)-调用patchVnode()对比和更新节点
把旧开始和新开始索引往后移动 oldStartIdx++ /oldEndIdx++

2、oldEndVnode/newEndVnode (旧结束节点/新结束节点)

用法同(旧开始节点/新开始节点)一样

3、oldStartVnode/newEndVnode(旧开始节点/新结束节点)

1，调用patchVnode()对比和更新节点
2，把oldStartVnode对应的DOM元素，移动到右边，更新索引

4、oldEndVnode/newStartVnode(旧结束节点/新开始节点)

1，调用patchVnode()对比和更新节点
2，把oldEndVnode对应的DOM元素，移动到左边，更新索引

5、非上述四种情况

6、循环结束

1，当老节点的所有子节点先遍历完(oldStartIdx >oldEndIdx), 循环结束

如果老节点的数组先遍历完【说明新节点有剩余，把剩余节点批量插入到右边】

2，新节点的所有字节点先遍历完(newStartIdx > newEndIdx), 循环结束

如果新节点的数组先遍历完【说明老节点有剩余，把剩余节点批量删除】

四、key的意义：用来比较vnode是否是相同节点

如果不设置会重复复用相同元素，会导致渲染错误