Vue.config.performance 以在浏览器开发工具的性能/时间线面板中启用对组件初始化、编译、渲染和打补

先上官网api如下图：performance-0

performance-0

如若启用performance，先安装google插件（google商店里面）：Vue Performance Devtool。

performance-1

看下源代码哪里控制:默认为false，不启用。

performance-2

先了解下源码里面有个mark函数：如下图（performance-3）

performance-3

window.performance是google浏览器自带的检验性能的api。具体使用方法自行google，介绍的很详细。

打开/src/core/instance/init.js里面有这样两处判断：

performance-4

performance-5

performance-4新建开始测量标志startTag，performance-5结束标志，而这段时间是在生命周期beforecreate和created之后（如图performance-5，callHook(vm, 'beforeCreate')，callHook(vm, 'created')），所以测量了这两个生命周期运行时间也就是创建实例需要多长时间。这是第一处测量。

看下第二处：在src/core/instance/lifecycle.js文件之中，上图（performance-6）

performance-7

很明显测量的是vm._render()函数的调用。

vm._render： 函数的作用是调用 vm.$options.render 函数并返回生成的虚拟节点(vnode)。

因此此处测量的是生成虚拟节点的时间。

下一个performance-8：src/platforms/web/entry-runtime-with-compiler.js

performance-8

很显然测量的是compileToFunctions这个方法，这个方法其实就是编译时长。

至此，这就是performance所用之处，只讲主线，具体测量每个函数里面怎么实现的烦请抽点时间自己看下。