Runtime-Compiler和Runtime-Only的区别

时间：2021-01-25 19:01:32 阅读：24 评论：0 收藏：0 [点我收藏+]

组件渲染过程

template --> ast --> render --> 虚拟Dom--> 真实的Dom --> 页面

我们在使用 runtime-only 的时候，需要借助 webpack的loader工具，将 .vue 文件编译为JavaScript，因为是在编译阶段做的，所以它只包含运行时的 Vue.js 代码，所以代码体积会更轻量。

在将 .vue 文件编译为 JavaScript文件的过程中会将组件中的 template 模版编译为 render 函数，所以我们得到的是 render 函数的版本。所以运行的时候是不带编译的，编译是在离线的时候做的

渲染过程：render函数 ---> 虚拟dom --->真实dom

因为在Vue中，最终渲染都是通过 render函数，如果写 template 属性，则会编译为 render 函数，那么这个编译过程会发生在运行时，所以需要带有编译器的版本
编译过程会对性能有一定的损耗

渲染过程：template --解析--> 成抽象语法树（ast）--编译成--> render函数 --->虚拟dom树 ---->真实dom

runtime-only： 将template在打包的时候，就已经编译为 render函数

runtime-compiler： 在运行的时候，才去编译 template

结果： 发布生产的时候，runtime-only 构建的项目代码体积更小，运行速度更快

原文：https://www.cnblogs.com/ltog/p/14326701.html

踩

(0)

评论一句话评论（0）

分享档案

更多>