vue 虚拟dom

https://segmentfault.com/a/1190000008291645

一个VNode的实例对象包含了以下属性

• tag: 当前节点的标签名

• data: 当前节点的数据对象

 

VNode可以理解为vue框架的虚拟dom的基类，通过new实例化的VNode大致可以分为几类

• EmptyVNode: 没有内容的注释节点

• TextVNode: 文本节点

• ElementVNode: 普通元素节点

• ComponentVNode: 组件节点

• CloneVNode: 克隆节点，可以是以上任意类型的节点，唯一的区别在于isCloned属性为true

webpack编译模板之后，会把这些模板编译成一个渲染函数（包含虚拟dom） 。

 

虚拟dom渲染更快的原因是：

VNode 只是用来映射到真实 DOM 的渲染，不需要包含操作 DOM 的方法，DOM属性值也少，因此它是非常轻量和简单的。