先上官網(wǎng)api如下圖:performance-0
如若啟用performance滑频,先安裝google插件(google商店里面):Vue Performance Devtool。
看下源代碼哪里控制:默認(rèn)為false唤冈,不啟用峡迷。
先了解下源碼里面有個mark函數(shù):如下圖(performance-3)
window.performance是google瀏覽器自帶的檢驗性能的api。具體使用方法自行g(shù)oogle你虹,介紹的很詳細(xì)绘搞。
打開/src/core/instance/init.js里面有這樣兩處判斷:
performance-4新建開始測量標(biāo)志startTag,performance-5結(jié)束標(biāo)志傅物,而這段時間是在生命周期beforecreate和created之后(如圖performance-5夯辖,callHook(vm, 'beforeCreate'),callHook(vm, 'created'))董饰,所以測量了這兩個生命周期運行時間也就是創(chuàng)建實例需要多長時間楼雹。這是第一處測量模孩。
看下第二處:在src/core/instance/lifecycle.js文件之中,上圖(performance-6)
很明顯測量的是vm._render()函數(shù)的調(diào)用贮缅。
vm._render: 函數(shù)的作用是調(diào)用 vm.$options.render 函數(shù)并返回生成的虛擬節(jié)點(vnode)榨咐。
因此此處測量的是生成虛擬節(jié)點的時間。
下一個performance-8:src/platforms/web/entry-runtime-with-compiler.js
很顯然測量的是compileToFunctions這個方法谴供,這個方法其實就是編譯時長块茁。
至此,這就是performance所用之處桂肌,只講主線数焊,具體測量每個函數(shù)里面怎么實現(xiàn)的煩請抽點時間自己看下。