携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第34天，点击查看活动详情
上一节中，我举了一个例子，只有p元素内的文本变了，其他结构都没变。因此我们只需要修改DOM属性就可以了，这就是最简单的DOM复用。
但其实，有的时候我们会碰见这种情况,比如在拖拽列表时,我们仅是改变了dom的排序或者位置
这个时候，我们可以发现，节点变化后，它的属性，内容都没有更新，更新的仅是顺序而已。
这时候如果按照之前粗暴的遍历操作，我们首先会遍历children，然后卸载旧的子节点，插入新的子节点。
因为这个节点的类型都变化了，在我们不考虑复用的时候，这里就是两个完全不同的节点。但实际上这种情况可以复用DOM的，我们只需要挪动dom的顺序就可以了。
因此我们需要知道两个虚拟DOM是否一致，于是就给它们增加一个key.key就相当于这个虚拟node的身份证号，我们可以根据key去判断2个节点是否一致。
所以，根据这个key,我们可以修改一下之前的patchChildren函数
通过循环遍历，我们找到了key值相同的节点，这时候再去patch就会简单很多，而且通过break我们减少了循环次数，优化了性能。
在找到2个key值相同的节点之后，我们仍旧需要执行patch，但是却可以减少执行次数，同时patch内部也可以因为key值相同减少一些操作，再次进行优化
下一节里,我们再看一下怎么样通过key值去移动元素，这也是diff算法中的一部分。
