虚拟DOM和真实DOM

一：什么是DOM？
        DOM就是文档对象模型，HTML的文档document页面时一切的基础，没有它dom就无从谈起。

当我们创建好一个页面并加载到浏览器的时候，DOM就悄然而生，它会把网页文档转换为一个文档对象，主要功能就是处理网页内容。在这个文档给对象里，所有元素呈现出一种层次，就是除了顶级元素html外，其他元素都被包含在另外的元素中。

文档对象模型就是一个节点树。

二：什么是虚拟DOM?
虚拟DOM是一个轻量级的JavaScript对象，它原本是真实dom的副本，是一个节点树，它将元素，它们的属性和内容作为对象及属性。渲染页面时会创建一个节点树，然后响应数据模型中的变化来更新该树，该变化是用户或系统完成的各种动作引起的。

三：虚拟DOM 的工作过程？
        1：首先根据数据创建虚拟dom,它反映真实DOM的结构，然后由虚拟dom创建真实的dom树，真实dom树生成之后，在渲染到页面上。

        2：如果数据发生改变，创建新的虚拟dom树，比较两个树的区别，调整虚拟dom的内部状态

        3：在虚拟dom收集到足够的改变时，再一次性应用到真实dom上，渲染到页面。

四：虚拟DOM的优点？缺点？
        优点：

                ①：保证性能下限

                ②：无须手动操作dom

                ③：跨平台

        缺点：

                ①：无进行极致优化

                ②：首次渲染大量DOM时，由于多了一层dom计算会比innerHTMl插入慢

五：真实dom和虚拟dom的区别？
         1：虚拟dom不会进行排版与重绘操作，虚拟dom就是把真实DOM转换为javaScript代码

        2：虚拟dom进行频繁修改，然后一次性比较并修改真实DOM中需要修改的部分，最后真实DOM进行排版重绘，减少节点排版与重绘损耗

虚拟节点可以理解成节点描述对象，它描述了应该怎样去创建真实的DOM节点。

虚拟DOM优势：渲染引擎操作 DOM 慢，js运行效率高，于是将DOM对比操作放在JS层，提高效率

提升渲染性能 Virtual DOM的优势不在于单次的操作，而是在大量、频繁的数据更新下，能够对视图进行合理、高效的更新

Virtual DOM 是以 JavaScript 对象为基础而不依赖真实平台环境，所以使它具有了跨平台的能力，比如说浏览器平台、Weex、Node 等。