打赏

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属性值也少,因此它是非常轻量和简单的。

posted @ 2018-11-21 17:31  孟繁贵  阅读(514)  评论(0编辑  收藏  举报
TOP