必须开启Network录制才能捕获DOMContentLoaded、LCP等关键节点数据；刷新前未启用将丢失全部时间指标。
要在谷歌浏览器中实时监控并分析某个网页的加载耗时，必须在页面加载发生的同时捕获完整生命周期数据，否则DOMContentLoaded、LCP等关键节点将无法回溯；刷新前未开启录制会导致全部时间指标丢失。
启用Network面板捕获全量网络请求
1、在Chrome中打开目标网页，确保地址栏显示为正常HTTP/HTTPS协议（非chrome://或file://）。
2、按下 F12 或右键页面空白处→选择“检查”，调出开发者工具。
3、点击顶部标签栏的 Network 选项卡，此时若左上角圆形按钮为灰色，需单击一次使其变红——【未启用录制将完全无法获取Finish值】。
4、勾选左上角 Preserve log 复选框，防止后续跳转或SPA路由切换清空日志。
5、按 Ctrl+R（Windows/Linux）或 Cmd+R（macOS） 强制刷新页面，所有资源请求即刻被记录。
从Performance面板提取首屏与交互关键时间点
该方法适用于需要定位白屏、内容出现、最大元素绘制及用户可操作时刻的场景，比Network更贴近真实用户体验。
方法一：快捷录制（推荐新手）
1、保持开发者工具开启，直接按 Ctrl+Shift+E（Windows/Linux）或 Cmd+Shift+E（macOS），无需切换标签页，自动进入Performance并开始录制。
2、页面刷新后自动停止，生成报告——此方式默认包含Screenshots，能直观看到首屏帧变化。
方法二：手动控制流程
1、切换到 Performance 标签页。
2、勾选 Screenshots 和 Memory（后者非必需，但有助于判断内存泄漏是否拖慢加载）。
3、点击左上角灰色圆形按钮开始录制→立即刷新页面→待页面视觉稳定（如滚动可用、按钮可点）后再次点击按钮停止。
4、在顶部时间轴区域，将鼠标悬停于 FP（First Paint）、FCP（First Contentful Paint）、LCP（Largest Contentful Paint）标记上方，直接读取毫秒值。
5、向下滚动至 Summary 区域，查找 TTI（Time to Interactive）所在行，其Duration列数值即为用户可稳定交互的时间点。
用Lighthouse做标准化加载性能快照
Lighthouse在模拟Slow 4G + Moto G4设备条件下运行整套审计，输出FP、FCP、LCP、TTFB等指标的绝对值与评分，适合横向对比不同版本或竞品网站。
1、确保开发者工具已打开，切换至 Lighthouse 面板（若未显示，点击右上角“⋯”→More tools→Lighthouse）。
2、取消勾选“Accessibility”“Best Practices”“SEO”“PWA”，仅保留 Performance 单项，加快生成速度。
3、确认设备模式为 Mobile，网络条件为 Slow 4G，然后点击 Generate report。
4、等待约20–40秒，报告生成后展开 Metrics 折叠区，直接查看 LCP、FCP、TTFB 的实测毫秒数及对应状态图标（绿色/橙色/红色）。
