虚拟dom实现原理及优缺点,虚拟dom为什么快

（摘抄自一篇文章，觉得这里写得非常不错，所以单独放出来，希望能对大家有帮助。）

React为什么这么大？ 因为实现了虚拟DOM (虚拟DOM )。 虚拟DOM在做什么？ 这个从浏览器本身开始吧。

众所周知，在浏览器渲染网页的过程中，当加载到HTML文档中时，文档将被分析以构建DOM树，并与分析CSS一起生成

将爱的结晶——RenderObject树与形成的CSSOM树结合在一起，将RenderObject树渲染到页面上(当然可能在中间有一个)

RenderLayer树等优化)。 这些进程与渲染引擎一起存在，渲染引擎在浏览器中是Javascript引擎

(可以是JavascriptCore，也可以是V8 )虽然很远，但为了方便JS处理DOM结构，渲染引擎会暴露一些接口供Javascript调用。

Javascript调用DOM提供的接口性能不太好，因为这两个块是相互分离的，并且通信成本很高。 最适合性能优化

实践也尽量减少了DOM操作次数。

虚拟DOM做了什么？ 直接用Javascript实现了DOM树。 组件的HTML结构不是直接生成DOM，而是如下所示

映射并生成虚拟的Javascript DOM结构，React通过在此虚拟DOM上实现diff算法来找到最小的更改，并更改这些更改

写入实际的DOM。 由于该虚拟DOM以JS结构形式存在，因此计算性能好，且实际的DOM操作次数减少，

性能将大幅提高。