瀏覽器支持
安裝了Firebug插件的Firefox、Google Chrome以及Safari都支持console.profile()語句,最新版的IE和Opera也提供了Profile功能。在幾大瀏覽器上console.profile()的使用大同小異,本文僅介紹Firebug中console.profile()的使用情況。值得注意的一點(diǎn)是:如果使用Firebug控制臺來直接編寫JavaScript實(shí)驗(yàn)代碼,那么console.profile()是無效的。
console.profile()的使用
console.profile()的使用非常簡單:在需要開始profile的地方插入console.profile(),在結(jié)束profile的地方插入console.profileEnd()即可。以下面的代碼為例:
代碼如下:
function doTask(){
doSubTaskA(1000);
doSubTaskA(100000);
doSubTaskB(10000);
doSubTaskC(1000,10000);
}
function doSubTaskA(count){
for(var i=0;i
function doSubTaskB(count){
for(var i=0;i
function doSubTaskC(countX,countY){
for(var i=0;i
}
console.profile();
doTask();
console.profileEnd();
在運(yùn)行doTask()函數(shù)前執(zhí)行console.profile(),doTask()函數(shù)運(yùn)行完成后執(zhí)行console.profileEnd(),這樣即可收集到doTask()函數(shù)運(yùn)行過程中的細(xì)節(jié)信息。在Firebug的控制臺中可以看到:
從結(jié)果中可以看到:此次profile時(shí)間共計(jì)101.901ms,涉及5次函數(shù)調(diào)用。結(jié)果的默認(rèn)標(biāo)題是”Profile”,可以通過向console.profile()函數(shù)傳入?yún)?shù)來進(jìn)行自定義。比如,使用console.profile(“Test Profile”)即可在結(jié)果中將此次profile的標(biāo)題改為”Test Profile”,這對于同時(shí)執(zhí)行多個(gè)profile過程的情況下尤為有用。具體profile結(jié)果中各列的含義為:
1.Function。函數(shù)名。
2.Calls。調(diào)用次數(shù)。比如,在上面的例子中,doSubTaskA()函數(shù)被執(zhí)行了2次。
3.Percent。該函數(shù)調(diào)用所消耗的時(shí)間在總體時(shí)間中所占的百分比。
4.Own Time。除去調(diào)用其它函數(shù)所消耗的時(shí)間,該函數(shù)本身的耗時(shí)數(shù)量。比如,在上面的例子中,doTask()無疑執(zhí)行了很長時(shí)間,但是因?yàn)槠浜臅r(shí)全部花在了對其它函數(shù)的調(diào)用上,因此其本身所耗時(shí)間并不多,僅為0.097ms。
5.Time。與Own Time相反,不考慮對其它函數(shù)的調(diào)用因素,計(jì)算函數(shù)的總耗時(shí)。在上面的例子中,doTask()函數(shù)執(zhí)行了101.901ms。對于Time和Own Time,也可以得到一個(gè)結(jié)論:如果Time比Own Time數(shù)值要大,那么該函數(shù)內(nèi)部就涉及了對其它函數(shù)的調(diào)用。
6.Avg。計(jì)算函數(shù)的平均總耗時(shí),其計(jì)算公式為:Avg=Time/Calls。在上面的例子中,doSubTaskA()函數(shù)被執(zhí)行了2次,其總耗時(shí)為1.054ms,因此其平均總耗時(shí)為0.527ms。
7.Min。對該函數(shù)調(diào)用的最小耗時(shí)。比如,在上面的例子中,doSubTaskA()函數(shù)被執(zhí)行了2次,其最小耗時(shí),也就是耗時(shí)較少的那次調(diào)用花掉了0.016ms。
8.Max。對該函數(shù)調(diào)用的最大耗時(shí)。比如,在上面的例子中,doSubTaskA()函數(shù)被執(zhí)行了2次,其最大耗時(shí),也就是耗時(shí)較多的那次調(diào)用花掉了1.038ms。
9.File。函數(shù)所在的JS文件。
Firebug中Profile按鈕的使用
除了在JavaScript代碼中插入console.profile()語句,F(xiàn)irebug還提供了Profile按鈕以便動態(tài)實(shí)時(shí)地對頁面中的JavaScript代碼進(jìn)行profile。該按鈕位置為:
當(dāng)需要進(jìn)行profile時(shí),可以按下該按鈕,如果接下來的頁面操作觸發(fā)了任何JavaScript代碼,F(xiàn)irebug將會對此進(jìn)行記錄。profile過程結(jié)束時(shí)只要再一次按下該按鈕即可。其最終結(jié)果與插入console.profile()語句所得到的結(jié)果時(shí)一致的。
聲明:本網(wǎng)頁內(nèi)容旨在傳播知識,若有侵權(quán)等問題請及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com