使用API​​剖析Javascript性能

Question

嘿，我一直在探索google-chrome調試工具和剖析工具。它真的很棒。我遇到的一個有用的東西是我以完整的樹形結構獲得執行的調用樹及其花費的時間（自身時間和總兒童時間計數）。

所以我想知道，如果我們可以使用一些JS API他們在樹結構的時序得到調用樹。如果我可以自動化，我可以使用這個樹時間來對我的代碼的不同版本進行基準測試，並且可以完成各種其他酷東西。

我無法通過網絡找到很多有用的東西。你能給我一些方向嗎？提前致謝。

讓我知道意見，如果某些部件在question.I不清楚會重組自己。

Answer 1

您可以使用console.profile()和console.profileEnd()開始和停止錄製個人資料。運行後，您可以在開發人員工具的「配置文件」選項卡中看到結果。

Answer 2

如果你想測試不同版本的應用，您可以輕鬆地在配置文件中的Chrome DevTools實現這一目標。您可以將它們錄製並保存到計算機中，然後在將來再次加載它們。這不只是當前會議。

例如，您記錄您的配置文件版本1，幾天後你加載了您的應用程序在Chrome中，記錄了新的配置文件，然後導入舊的和比較圖表或樹視圖。

你甚至可以打開你的電腦，其中存儲在JSON格式上保存的文件。你有需要在那裏玩的所有數據。您可以運行服務器來解析數據並將相關信息提取爲您喜歡的格式。數據量可能巨大且緩慢。

有關評論更新：

兩個console.timeline和console.timelineEnd已過時，與console.time和console.timeEnd取代。但是，沒有要存儲的返回值，所以您無法對JavaScript中的結果進行任何操作。但是，您可以使用window.performance：

var start = window.performance.now(); 
// your function 
var end = window.performance.now(); 
var timeSpent = (end - start); 
var stack = new Error().stack; // get call stack 

然後，您可以做你的結果一樣。

var oldFunc = myFunc; 

myFunc = function() { 
    var start = window.performance.now(); 
    var returnVal = oldFunc.apply(this, arguments); 
    var end = window.performance.now(); 
    var timeSpent = (end - start); 
    var stack = new Error().stack; // get call stack 
    return returnVal; 
}