如何比较两个 DOM 树的差异？

本节目标：理解“如何比较两个 DOM 树的差异？”的核心思路，并能把它用于实际开发或面试表达。 ==两个树的完全== ==diff== ==算法的时间复杂度为== ==O(n^3)== ==，但是在前端中，我们很少会跨层级的移动元素，所以我们只需要比较同一层级的元素进行比较，这样就可以将算法的时间复杂度降低为== ==O(n)====。====== ==算法首先会对新旧两棵树进行一个深度优先的遍历，这样每个节点都会有一个序号。在深度遍历的时候，每遍历到一个节点，我们就将这个节点和新的树中的节点进行比较，如果有差异，则将这个差异记录到一个对象中。== ==在对列表元素进行对比的时候，由于== ==TagName== ==是重复的，所以我们不能使用这个来对比。我们需要给每一个子节点加上一个== ==key====，列表对比的时候使用== ==key== ==来进行比较，这样我们才能够复用老的== ==DOM== ==树上的节点。==

> 来自

 <https://github.com/CavsZhouyou/Front-End-Interview-Notebook/blob/master/JavaScript/JavaScript.md>