如何利用 Google Performance 面板分析阻塞页面渲染的任务?
分析谷歌性能面板查找阻塞页面渲染任务
为了提高 Lighthouse 评分,优化阻塞页面渲染的任务至关重要。在 Google 的 Performance 面板中,"L" 表示所有资源加载完成。不过,并不是在这个点之前的任务都阻塞了页面渲染。
要分析阻塞页面渲染的任务,需要关注 Performance 面板中的 "Main" 主线程区域,而不是 "Network" 网络区域。在 "Main" 区域中,查找与渲染相关的任务,如:
- Recalculate Style
- Layout
- Paint
- Commit
这些任务之前的 JS 任务是阻塞页面渲染的。如下图所示:
[Image of Google Performance Panel highlighting Main thread and rendering tasks]
通过分析这些阻塞任务,您可以了解它们的持续时间和影响,从而采取措施进行优化。
以上就是如何利用 Google Performance 面板分析阻塞页面渲染的任务?的详细内容,更多请关注硕下网其它相关文章!