web前端：vue 的虚拟 DOM 有什么好处？

作者:honzen 更新于： 2020-03-05 11:52:58

　　DocumentObjectModel的历史可以追溯至1990年代后期微软与Netscape的"浏览器大战"，双方为了在Javascript与JScript一决生死，于是大规模的赋予浏览器强大的功能。微软在网页技术上加入了不少专属事物，既有VBScript、ActiveX、以及微软自家的Dhtml格式等，使不少网页使用非微软平台及浏览器无法正常显示。DOM即是当时蕴酿出来的杰作。

　　vue中的虚拟DOM有什么好处？快！

　　首先了解浏览器显示网页经历的5个过程

　　1、解析标签，生成元素树（DOM树）

　　2、解析样式，生成样式树

　　3、生成元素与样式的关系

　　4、生成元素的显示坐标

　　5、显示页面

　　修改真实DOM

　　每修改一个元素，那么这5个过程都要重新走一次。修改10个元素就走10遍。

　　修改虚拟DOM

　　虚拟DOM存储在内存中，对10个元素的修改是在虚拟DOM中进行，修改完后，比较虚拟DOM和真实DOM的差异，当有差异时，再一次过去更新网页的显示，而不是走10遍过程。

　　虚拟DOM好处