虚拟 dom

由于在浏览器中操作 DOM 是很昂贵的。频繁的操作 DOM，会产⽣⼀定的性能问题. 所以在vue中将真实的DOM节点抽离成⼀个虚拟 的DOM树,这个虚拟的DOM树就是虚拟DOM

优点: 保证性能下限： 框架的虚拟 DOM 需要适配任何上层 API 可能产⽣的操作，它的⼀些 DOM 操作的实现必须是普适的，所以它 的性能并不是最优的；但是⽐起粗暴的 DOM 操作性能要好很多，因此框架的虚拟 DOM ⾄少可以保证在你不需要⼿动优化的 情况下，依然可以提供还不错的性能，即保证性能的下限；

⽆需⼿动操作 DOM： 我们不再需要⼿动去操作 DOM，只需要写好 View-Model 的代码逻辑，框架会根据虚拟 DOM 和 数据双向 绑定，帮我们以可预期的⽅式更新视图，极⼤提⾼我们的开发效率；

跨平台： 虚拟 DOM 本质上是 JavaScript 对象,⽽ DOM 与平台强相关，相⽐之下虚拟 DOM 可以进⾏更⽅便地跨平台操作，例如 服务器渲染、weex 开发等等。

缺点: ⽆法进⾏极致优化： 虽然虚拟 DOM + 合理的优化，⾜以应对绝⼤部分应⽤的性能需求，但在⼀些性能要求极⾼的应⽤中虚拟 DOM ⽆法进⾏针对性的极致优化。

⾸次渲染⼤量 DOM 时，由于多了⼀层虚拟 DOM 的计算，会⽐ innerHTML 插⼊慢

虚拟 dom 是利用 js 描述元素与元素的关系，用 js 对象来表示真实的 DOM 树结构，创建一个虚拟 DOM 对象

由于在浏览器中操作 DOM 是很昂贵的。频繁的操作 DOM，会产⽣⼀定的性能问题.

在组件渲染的时候会调用 render 函数，这个函数会生成一个虚拟 dom，再根据这个虚拟 dom 生成真实的 dom，然后这个真实的 dom 会挂载到我们的页面中。

如果只是渲染一个页面后期不改动的话 那么虚拟 dom 其实成本更高 因为 都要渲染成真实的 dom

如果组件内有响应的数据，数据发生改变的时候 render 函数会生成一个新的虚拟 dom 新的虚拟 dom 树和旧的虚拟 dom 树进行对比，找到要要修改的虚拟 dom 的部分，去修改相对应部分的真实 dom