对虚拟DOM的一点理解

起因：DOM的操作是很慢的，每次涉及到的状态改变都会重新进行DOM操作。

怎么去进行性能优化？（整体的思想是减少对DOM的操作）

1).既然DOM操作很慢，那就不用DOM

优点：性能全面提升

        最开始有个公司提出了一个全新的理解，既然DOM很慢，那么就不用DOM，他们直接用的是canvas（画布），相当于用户操作的是一个canvas，而没去改变DOM节点，这样避免使用DOM就避免了DOM的操作延时，再加上canvas能够被硬件加速，这样做带来的性能提升就不只一点了。

缺点：技术难题

因为和用户直接进行交互的就只是一个位图，他本身并没有任何语义，意思是他本身不能执行任何操作，如果想要执行操作就必须把原有的所有的东西发明一遍，这个更新成本太高了。而且技术能不能实现也是一个问题。

2).虚拟DOM

优点：开发效率和执行效率整体提升

因为操作内存中的Js对象很快,DOM很慢，而JS对象又可以很容易地去表示DOM节点，所以我们就可以用JS去构建一个虚拟DOM，然后就能根据这个虚拟DOM去渲染真实DOM，也就是说不管怎样我们还是需要去操作真实DOM的，所以虚拟DOM中的一个关键点就是比较虚拟DOM和真实DOM的不同，而实现这个的关键点就是diff算法，就通过这个算法去计算出最小修改量，然后通过这个最小修改量去对真实DOM执行最小修改。

diff算法：

1）.算法的简单优化：计算两颗树的差异，但是根据移动端的独特性，我们可以只对同级别的DOM节点进行比较，这样就减少了这个算法的复杂性。

2）.具体算法操作：我们要比较两颗树的差异，首先需要对两颗树进行深度遍历，在遍历的过程中我们需要记录节点之间的差异，我们可以对这个差异进行分类，记录下差异，把这些差异整理成数据结构，然后用这个整理好的数据结构去对DOM进行修改。

缺点（个人认为的缺点）：

因为虚拟DOM的关键就是通过diff算法去计算出差异来对真实DOM进行最小化修改，所以个人认为成也diff，败也diff，对真实DOM的操作完全依赖于这个算法，所以这个算法的精确与否就决定了对真实DOM的修改多少，也就决定了执行效率（性能）。

然而虚拟DOM提出的最大的意义不在于性能的提升，而是在于对DOM的抽象，这个行为跟不用DOM的那个团队一样，是一个开创性的进步，是大前端对性能优化上的关键一步。

以上只是个人的一点浅见，如有错误或是不足还望指出。