已解決430363個問題，去搜搜看，總會有你想問的

Google Developers Network 選項卡紫線

關注

首頁猿問 Google Developers...

JavaScript

MYYA 2023-04-27 10:38:51

我正在使用 nuxt js，我看到在這條紫色線之后正在下載一些代碼：現在我的問題是這一行顯示了什么，為什么下載的代碼不會影響我的 Lighthouse 性能得分？

查看完整描述

1 回答

翻閱古今

TA貢獻1780條經驗獲得超5個贊

這條線實際上不是紫色的，它是一條紅線和一條藍線并排在一起。

藍線是“DOM 內容加載”時間，紅色是“加載”時間。

“DOMContentLoaded”事件在文檔加載完畢且 DOM 樹完全構建時觸發。

“加載”事件在所有子框架、圖像、樣式表、腳本等都已下載后觸發。（這會忽略諸如延遲腳本、異步腳本等內容，因為從技術上講，它們不是初始文檔的一部分）

至于在它之后加載的內容，它仍然會影響您的性能，因為它會影響諸如 Cumulative Layout Shift、Total Blocking Time 等內容。這些線僅供參考。

如果您嘗試計算頁面的性能，最好使用開發人員工具中的“性能”選項卡。

這使您可以運行完整的跟蹤并突出顯示更有意義的指標，例如首次繪制、首次內容繪制、最大內容繪制（在“時間”部分下）和“體驗”部分下的任何累積布局偏移等。

反對回復 2023-04-27

關注

舉報

0/150

提交

取消