- vdom是什么
- 引入vdom的好处
- vdom如何生成，又如何成为dom
- 在后续的diff中的作用
- 概念：虚拟dom顾名思义就是虚拟的dom对象，它本身就是一个JavaScript对象，只不过它是通过不同的属性去描述一个视图结构，相比于真实dom只保留了核心属性，进而使后续操作更加快速；
- 通过引入vdom我们可以获得如下好处：
- 将真实元素节点抽象成VNode，有效减少直接操作dom次数，从而提高程序性能；
- 直接操作 dom是有限制的，比如：diff、clone等操作，一个真实元素上有许多的内容，如果直接对其进行diff操作，会去额外diff一些没有必要的内容；同样的，如果需要进行clone，那么需要将其全部内容进行复制，这也是没必要的。但是，如果将这些操作转移到JavaScript 对象上，那么就会变得简单了；
- 操作 dom 是比较昂贵的，频繁的dom操作容易引起页面的重绘和回流，但是通过抽象VNode进行中间处理，可以有效减少直接操作dom的次数，从而减少页面重绘和回流；
- 方便实现跨平台
- 同一VNode节点可以渲染成不同平台上的对应的内容，比如：渲染在浏览器是dom元素节点，渲染在Native（iOS、Android）变为对应的控件、可以实现SSR（服务端渲染）、渲染到WebGL中等等；
- Vue3中允许开发者基于VNode实现自定义渲染器（renderer），以便于针对不同平台进行渲染；
3.dom如何生成，又如何成为真实dom？以及在diff中的作用
在vue中我们常常会为组件编写模板template，这个模板会被编译器compiler编译为渲染函数（render function），在接下来的挂载（mount）过程中会调用render函数，返回的对象就是虚拟dom。 但它们还不是真正的dom，会在后续的patch过程中进一步转化为真实dom
- 挂载过程结束后，vue程序进入更新流程。如果某些响应式数据发生变化，将会引起组件重新render，此时就 会生成新的vdom，和上一次的渲染结果diff就能得到变化的地方，从而转换为最小量的dom操作，高效更新 视图。
