Virtual DOM是对DOM的抽象,本质上是JavaScript对象,这个对象就是更加轻量级的对DOM的描述.
真实DOM和其解析流程：
创建DOM树——创建StyleRules——创建Render树——布局Layout——绘制Painting
第一步: 利用HTML分析器，分析HTML元素，构建一颗DOM树
第二步: 利用CSS分析器，分析CSS文件和元素上的inline样式，生成页面的样式表
第三步：将DOM树和样式表关联起来，构建一颗Render树(这一过程又称为Attachment).每个DOM节点都有attach方法，接受样式信息
返回一个render对象（又称renderer).这些render对象最终会被构建成一颗Render树
第四步：浏览器将每个Render树上的节点确定一个在显示屏出现的精确坐标
第五步：Render树和节点坐标都有了，调用每个节点的paint方法，将他们绘制出来
DOM树不是等到整个HTML文档解析完之后才开始构建的，构建DOM树是一个渐进的过程，渲染引擎会尽快的将内容显示到屏幕上
CSS的解析是从DOM树的下-上开始解析的 ，嵌套标签越多，解析越慢。
Render树是DOM树和CSSOM树并行构建的，这三个过程是并行的
Dom操作会导致浏览器重新绘制Dom树，然后渲染到浏览器上，这样每次重新绘制白白浪费计算机性能；
虚拟Dom就是为了解决浏览器性能问题而被设计出来的，将页面的更新全部反映到JS对象上，操作内存中的JS对象的速度显然要更快
，等更新完成后，再将最终的JS对象映射成真实的DOM,交由浏览器去绘制。
----简单来说：记录虚拟树新树和旧树的差异，将差异更新到真实树上
Diff算法：完成这种差异