诊断优化流程
您可导航至优化页面,该页面位于性能监控菜单下,选取待洞察的指标即可。您也可以通过在分析看板中查看对应的性能数据跳转至此功能。指标选择
选择页面和指标后,便可开始做性能数据洞察:
- 点击指标卡片选择要洞察的指标(目前支持 LCP、FCP、INP、CLS)
- 在「显示筛选细分」中选择一个组
- 在不同的百分位数处评估指标(例如 p75 表示第 75 个百分位数值)
优化方向
- 优化资源加载
- 解决错误
- 瀑布图分析
资源加载分析面板展示当前视图下所有资源的详细加载信息,帮助您识别性能瓶颈。您可以通过「全部资源」和「阻塞资源」两个选项卡切换查看范围:
- 全部资源:展示视图中加载的所有资源
- 阻塞资源:仅展示标记为
blocking的渲染阻塞资源,这些资源会延迟页面的首次渲染
| 字段 | 说明 |
|---|---|
| URL GROUP | 资源的 URL 路径分组 |
| TYPE | 资源类型(如 JS、CSS、Image 等) |
| AVG CLIENT SIZE | 平均客户端资源大小 |
| AVG TRANSFER SIZE | 平均传输大小(如传输大小明显小于客户端大小,说明部分采样命中了缓存) |
| AVG START TIME | 平均开始加载时间 |
| AVG DURATION | 平均加载耗时,并以色条可视化展示 DNS 解析、连接建立、首字节等待和下载四个阶段的耗时占比 |


