runtime-complier 和 runtime-only 的区别

2024-06-26 19:56:22

runtime-complier 和 runtime-only 的区别

在使用vue-cli2创建项目时，会遇到一个选项，如下图：

有两种不同的模式
第一种：runtime-complier 默认选择
第二种：runtime-only 优点更多

runtime-only 有两种优点：

代码量更少
性能更高

所以我分别创建两个不同的项目，来进行比较，发现只有main.js中一些差别，如下图：

得出：runtime-complier 是用template模板，使用components注册组件的，而runtime-only是使用render函数来实现的

这里我们就需要来了解一下，template在vue 内部里是怎么渲染的

由上图可知：template 会先被解析成 ast（abstract syctax tree 抽象语法树），在被编译成 render 函数，而这个render函数会构建一个virtual(虚拟) dom，最后再渲染成真实dom，也就是UI，进行页面展示。

所以我们就可以得出：

runtime-complier的步骤：template -> ast -> render -> virtual dom -> 真实dom
runtime-only 的步骤：render ->virtual dom -> 真实dom

所以这里就有一个疑问了，为什么在runtime-only中就可以直接跳过前面的template解析阶段呢？因为在创建项目的时候，vue-cli自动帮我们安装了一个 vue-template-complier 插件，而这个插件会在项目启动时自动帮我们把template转换为render函数。

通过上面的比较就能够得出 runtime-only 相比于 runtime-complier ，代码量更少，性能更高

所以建议大家在开发项目时，多使用runtime-only模式，并且在实际开发中也使用的更多。
ps：第一次写博客，有什么不足的地方，请指出其中的错误，我会改正的。

runtime-complier 和 runtime-only 的区别相关推荐

bug4 导入新工程时报 Target runtime com.genuitec.runtime.generic.jee60 is not defined
系统加载工程后,报错Target runtime com.genuitec.runtime.generic.jee60 is not defined,在发布工程的同事电脑上正常.新导入的工程,出问题很 ...
import导入工程时出现error：Description Resource Path Location Type Target runtime com.genuitec.runtime.gener
Myeclipse把一个workspace里的项目导入另一个workspace时,项目提示error: Description Resource Path Location Type Target r ...
Docker系列之AspNetCore Runtime VS .NetCore Runtime VS SDK（四）
接下来我们就要慢慢步入在.NET Core中使用Docker的殿堂了,如题在开始之前,我们需要搞清楚一些概念,要不然看到官方提供如下一系列镜像,我们会一脸懵逼,不知道到底要使用哪一个. AspNetC ...
Target runtime com.genuitec.runtime.generic.jee60 is not defined.报错解决
Eclipse系统加载工程后,报错Target runtime com.genuitec.runtime.generic.jee60 is not defined, 新导入的工程,出问题很大可能是jd ...
Target runtime com.genuitec.runtime.generic.jee60 is not defined
转载自:http://jingyan.baidu.com/article/d7130635338e3f13fdf47518.html 用eclipse加载别人的工程,报错Target runtime ...
Runtime - 常用的runtime API介绍
其实也不咋常用,毕竟用runtime都少 #import <objc/runtime.h> 使用runtime之前一定要导入这个 Class object_getClass(id obj) ...
Nokia E52的Runtime java.lang.Runtime Exception Toolkit Closed问题解决
开发的项目在E52上安装完成了,运行开始就退出了,显示 Runtime java.lang.Runtime Exception Toolkit Closed 参考:http://discussion. ...
了解vue里的Runtime Only和Runtime+Compiler
在我们使用vue-cli的时候,会提示你安装的版本可以看到有两种版本: Runtime Only 版本和 Runtime+Compiler 版本. 1.Runtime Only 我们在使用 Run ...
Runtime底层原理--Runtime简介、函数注释
Runtime官方文档介绍直通车扩展:编译时看到运行时就会想到编译时,编译时主要是将源代码翻译成可识别的机器语言,如果编译时类型检查等翻译过程中发现语法分析之类有错误会给出相应的提示.比如OC,s ...
SAP ABAP DDICSAP ABAP DDIC table runtime object table runtime object
Created by Jerry Wang, last modified on Dec 30, 2014 如何显示DDIC table的runtime object: field PRODUCT_TY ...

最新文章

热门文章