Vue渲染过程

vue渲染过程

初次渲染过程

1. 解析模板为render函数（或在开发环境已完成，vue-loader）
2. 触发响应式，监听data属性getter setter
3. 执行render函数，生成vnode，patch(elem, vnode)

更新渲染流程

1. 修改data，触发setter（此前在getter中已被监听）
2. 重新执行render函数，生成newVNode
3. patch(vnode, newVNode)

异步渲染

• 汇总data的修改，一次性更新视图
• 减少DOM操作次数，提高性能