谷歌瀏覽器時間軸

Question

我正在記錄我目前工作的網站的性能。 當我檢查時間軸。有這些不同的顏色顯示（我的猜測）fps，CPU，內存。但我不知道哪個是哪個。

任何人都可以解釋這些不同的顏色是什麼意思？我已經搜索，但我看不到任何具有此佈局的時間軸解釋。

Answer 1

最上面的條帶（紅色的）是響應性。如果它是紅色的，那麼你在那個地方有問題，例如非常長的框架造成不必要的，過度的風格重新計算等。使用火焰圖放大該區域以查找細節。

下一個（綠色）是幀率。越高越好。 Max是60fps。

下一個是CPU利用率，它的顏色取決於CPU當前正忙於處理的活動類型。例如。大量的黃色表示它運行JS代碼，紫色表示CSS樣式的重新調整或佈局等。

帶小條的最後一條是網絡活動。它顯示目前是否有網絡請求正在飛行。