携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第7天，点击查看活动详情
要了解diff算法之前，我们需要先了解关于虚拟DOM的概念。在上篇中曾介绍过关于虚拟DOM的特点，Vue通过虚拟DOM操作真实DOM来进行数据的更新。
diff算法算法是虚拟DOM的实现过程中非常关键的一步，实现过程就是调用patch函数，比较新旧节点，同时给真实的DOM “打补丁”。 patch在计算机领域中是“补丁”之意。patch是虚拟DOM最核心的部分，用于新旧的虚拟节点对比。而本文提到的
具体流程
模板------->编译------>执行渲染函数----->生成虚拟节点----->createElement(将VNode渲染成DOM节点)----->patch(新旧的虚拟节点对比)----->更新视图
我们还是先来看看源码文件的结构：
算法策略
Diff算法策略为：深度优先
在数据结构的概念中，遍历树结构有深度优先和广度优先两种方式。深度优先主要思想是从一个未访问的顶点开始（一般从根节点开始），沿着一条路一直走到底，直到无路可走后回退到上一个节点，再从另一条路开始重复前面的步骤，不断递归重复此过程，直到全部节点遍历完成，即一条路走到黑，再退回去选择其他路继续一条路走到黑。
算法特点：
- 同层比较，不跨级
- 遍历过程中已存在的节点直接复用
- 如果没有旧的节点，直接用新节点生成 DOM 元素（没有旧节点说明是页面刚开始初始化的时候，不需要进行比较），对应上面流程中的createElement(将VNode渲染成DOM节点)
- 如果旧节点有子节点，但新节点没有，则删除旧节点的DOM（页面更新后旧节点全部消失）
- 子节点不完全一致，则调用updateChildren
- watcher用来监测页面更新，然后调用patch方法给真实的DOM打补丁
