diff算法

参考文章：
https://blog.csdn.net/qq_36337754/article/details/104933542

https://www.cnblogs.com/wind-lanyan/p/9061684.html

https://www.jianshu.com/p/cfbde0326dde

diff的过程就是调用名为patch的函数，比较新旧节点，一边比较一边给真实的DOM打补丁。

image.png

patchVnode过程：

image.png

其中updateChildren的过程：
该过程为不断更新子节点的过程，从两头向中间走

image.png

其中判断sameVnode的条件为：

image.png

从sameVnode中可以看出：如果在节点中未定义key的话，那么如果key之后的几个条件满足的话，新旧节点在比较中永远返回true，即updateChildren的分支永远走到该处：

else if (sameVnode(oldStartVnode, newStartVnode)) {
      patchVnode(oldStartVnode, newStartVnode, 
      insertedVnodeQueue, newCh, newStartIdx);
      oldStartVnode = oldCh[++oldStartIdx];
      newStartVnode = newCh[++newStartIdx];

如此，在不断循环的过程当中，updateChildren和patchVnode会不断反复调用，引起不必要的计算浪费