1、安裝Web Vitals瀏覽器插件
2、打開設置
3、勾選打印日誌
4、 打開瀏覽器控制檯即可查看需要優化的點
5、LCP耗時的構成部分
"LCP sub-part": "Time to First Byte"
- "Time (ms)": 39
- 這個部分時間表示服務器的首個字節到達所花費的時間。這是指從瀏覽器發出請求到服務器響應的時間。較短的時間對於優化 LCP 持續時間很重要，因爲它反映了服務器響應的速度。
"LCP sub-part": "Resource load delay"
- "Time (ms)": 3247
- 這部分時間表示資源加載延遲的時間。即資源開始加載直到加載完成之間的時間。這可能受到網絡速度或者服務器性能等因素的影響。
"LCP sub-part": "Resource load time"
- "Time (ms)": 27
- 這指的是實際資源加載所需要的時間。這部分時間表示了實際下載資源所花費的時間。
"LCP sub-part": "Element render delay"
- "Time (ms)": 19
- 這部分時間表示元素渲染延遲的時間。即資源下載完成後到元素實際呈現完成之間的時間。