1. 什么是Virtual DOM?

虚拟DOM是指用JS模拟DOM结构。本质上来讲虚拟DOM是一个真实的JS对象，并且至少包含三个属性：tag(html标签)，props(标签的属性，如class)，children(子元素对象)。

2. 为什么需要Virtual DOM?

　　我们应该知道，用JS操作dom会引起回流和重绘，严重影响性能。但在项目中经常会有增删改查的需求，DOM结构会发生改变。

a.最简单的做法：通过JS操作DOM。该方法的缺点：随这应用的复杂度提升，代码变的难以维护，且性能不好，每次dom操作可能都会引起浏览器的回流和重绘。

b.MVVM模式，只要在模版中声明视图组件是和什么状态进行绑定的，双向绑定引擎就会在状态更新的时候自动更新视图，MVVM 可以能很好的降低维护状态以及减少视图的复杂程度。

还有一个非常直观的方法，可以大大降低视图更新的操作。一旦状态发生了变化，就用模版引擎重新渲染整个视图，然后用新的视图更换掉旧的视图。在 JS 里面更新状态，但是页面更新就不用手动操作 DOM 了，直接把整个表格用模版引擎重新渲染一遍，然后设置一下 innerHTML 。此方法会导致 DOM 操作变慢，因为任何的状态变更都要重新构建整个 DOM。

　　JS操作真实DOM速度很慢，而操作JS对象非常快，我们就可以用 js对象表示的树结构来构建一个真正的 DOM 。当状态变更时，重新渲染这个 JS的对象结构，实现视图的变更，结构根据变更的地方重新渲染。这就是虚拟 DOM 算法。

通过虚拟DOM的比较，我们可以将多个操作合并成一个批量的操作，并且只更新有差异的部分，从而减少dom重排的次数，进而缩短了生成渲染树和绘制所花的时间。