有一点需要明确：性能受场景的影响是非常大的，不同的场景可能造成不同实现方案之间成倍的性能差距，所以Virtual DOM的性能不一定就好，需要依赖细粒度绑定来进一步优化。
首先有一点需要明确的是: 目前主流的框架基本都是DOM in js ,将一个个html抽象成组件，跳转页面即映射组件，包括vue、react基本都是本原理，并且目前最新的css方案是 css-in-js，这意味着什么？
从万物即web(很多东西都是一个webview壳子套H5页面)，到web即js
对”DOM操作慢”的认识
很大一部分耗时是操作dom时的浏览器动作，虚拟dom的很大一部分性能提升是把更新的操作次数减少.
浏览器（webkit内核的）进行一次渲染的过程如下所示：
- 解析HTML，并生成一棵DOM tree
- 解析各种样式并结合DOM tree生成一棵Render tree
- 对Render tree的各个节点计算布局信息，比如box的位置与尺寸
- 根据Render tree并利用浏览器的UI层进行绘制
举个例子，如果我们需要创建10个具有一定长宽颜色等等样式的div，如果我们用直接dom的形式进行，那就是一个接一个的创建、添加、删除元素等等操作。
在这个过程中，创建第一个触发一次浏览器针对dom改变的动作；接着可能一次接一次的触发9次浏览器相关动作,并且当元素的位置和大小改变、添加删除dom节点时，浏览器会重新进行上述的‘layout’，而浏览器的laout布局刚好是一个需要花比较多时间的过程。
当大量元素改变时浏览器甚至会重新渲染整个页面，这个就很可怕了，势必要重新加载，重新首屏渲染