什么是Diff算法？
diff算法就是用于比较新旧两
vue中的虚拟dom
目前虚拟dom的类库有多种，常见的有snabbdom和virtual-dom， vue以前用的是virtual-dom，从2.x版本后都是使用的snabbdom。(snabbdom源码下载) 今天，我们就通过snabbdom源码来解析vue的虚拟dom
diff 比较规则
1、diff 比较两个虚拟dom只会在同层级之间进行比较，不会跨层级进行比较。而用来判断是否是同层级的标准就是
- 是否在同一层
- 是否有相同的父级
下面，我们来一张图，就很好理解了
2、diff是采用先序深度优先遍历得方式进行节点比较的，即，当比较某个节点时，如果该节点存在子节点，那么会优先比较他的子节点，直到所有子节点全部比较完成，才会开始去比较改节点的下一个同层级节点。不好理解吗？没关系，我们画个图看一下，就很清晰了
当比较新旧两个dom时，会按照图中1-9的顺序去进行比较。
?不过，既然话都说到他的比较顺序了，我就想干脆，先整体将他每一步是如何比较的，让大家心里有一个总体的比较思路后，我们再去一步一步看patch函数，patchVnode函数和updateChildren函数
diff比较整体思路
????????首先开始比较两个vdom时，这两个vdom肯定是都有各自的根节点的，且根节点必定是一个元素，不可能存在多个。我们首先要比较的肯定是根节点，那我们都知道根节点只有一个，就可以直接比较了。而一个节点的比较，通常分为3个部分
声明，下面所说的sel选择器相同，指的是标签名，id，class都相同。
例如
’这样一个dom，他的sel是"div#app.abc"
比较两个节点是否是相同节点，判断是否是相同节点的条件是，key和sel（选择器）必须都相同（那有的人可能会说了，那我标签没有key怎么办啊，没有key那就是undefined，undefined === undefined 始终为true，所以没有key只需要保证sel相同就行）。如果不相同，那么执行替换操作（即新增新vnode上的元素，删除旧vnode上的元素 例如，原来是div，新vnode变成了p，那么就是新增p元素，再删除div元素。相当于就是p替换了div），这一步，只有比较根节点时，是在patch函数中进行的。非根节点都是在updateChildren函数中执行的，因为根节点只会有一个，可以直接比较，而其他节点会存在多个，需要通过一些算法来判断，具体详情后面会说
如果节点相同，那么进去第二部分，即比较两个节点的属性是否相同，节点是否存在文本，文本是否相同。是否存在子节点，子节点是否相同。这部分主要在patchVnode中执行
那么，在第二部分，会做哪些事情呢。
1、如果存在文本时，更新文本
2、如果存在属性时，更新属性
3、如果存在子节点时，更新子节点
那么，如何更新呢，逻辑也很简单，遵循以下规则：
1、如果旧vnode上存在，而新vnode上不存在，那么执行删除操作
2、如果旧vnode上不存在，而新vnode上存在，那么执行新增操作
3、如果新旧vnode上都存在，那么执行替换操作（即，新增新的，删除旧的），文本，和属性的替换是在这部分完成。而对于子节点，如果新vnode和旧vnode上都存在子节点时，那么会进入第三部分比较。比较子节点的差异。
第三部分，主要在updateChildren函数中执行，主要用于比较某个节点下的子节点差异。而在这里，就要用到diff的一个算法了。具体怎么算。我们后面详细说updateChildren时再说。
?
?