通常咱们利用 vue-cli 去初始化咱们的 Vue.js 我的项目的时候会询问咱们用 Runtime Only 版本的还是 Runtime + Compiler 版本。上面咱们来比照这两个版本。
- Runtime Only
咱们在应用 Runtime Only 版本的 Vue.js 的时候,通常须要借助如 webpack 的 vue-loader 工具把 .vue 文件编译成 JavaScript,因为是在编译阶段做的,所以它只蕴含运行时的 Vue.js 代码,因而代码体积也会更轻量。
Runtime Only版本艰深来说也就是公布到浏览器的时候并不存在template版本。是浏览器能够辨认的render函数。
咱们平时SPA应用webpack进行打包的代码其实就是runtime-only代码,vue会帮咱们把template编译成render函数模式的出现。
简而言之,runtime Only版本是运行时不做编译,编译是在离线的时候做(打包时候进行编译)。
- Runtime + Compiler
咱们如果没有对代码做预编译,但又应用了 Vue 的 template 属性并传入一个字符串,则须要在客户端编译模板
compiler就是应用的vue版本在公布的时候能够应用template标签,vue会在运行的时候辨认这些template标签并帮忙咱们转化为render函数。
也就是vue在运行的时候,留神是vue运行的时候vue帮咱们进行编译。
,如下所示:
// 须要编译器的版本new Vue({ template: '<div>{{ hi }}</div>'})// 这种状况不须要new Vue({ render (h) { return h('div', this.hi) }})
因为在 Vue.js 2.0 中,最终渲染都是通过 render
函数,如果写 template
属性,则须要编译成 render
函数,那么这个编译过程会产生运行时,所以须要带有编译器的版本。
很显然,这个编译过程对性能会有肯定损耗,所以通常咱们更举荐应用 Runtime-Only 的 Vue.js。