前端

梗概:

  • Vue可以将一份用户编写的模板转换为真实的DOM节点
    • 且非常高效

渲染机制:

  1. 编译:Vue 模板被编译成渲染函数:即用来返回vnode 的函数。这一步骤可以通过构建步骤提前完成,也可以通过使用运行时编译器即时完成。
  2. Vue 组件模板中使用的每一个html 标签都会对应一个Vue 渲染函数
  3. 把多个Vue 渲染函数vnode合并获得虚拟DOM
  4. child::渲染VDOM

图解

更详细的原理细节:

讲解为什么Vue的渲染更加高效: 渲染机制 | Vue.js