Web端访问缓慢问题诊断指南（测试工程师专项版）
——从浏览器渲染到网络层的全链路排查方案
一、问题定位黄金法则（前端性能四象限）
1. [网络层] 数据返回快 ≠ 资源加载快（检查Content Download时间） 2. [渲染层] DOM复杂度与浏览器重绘（查看FPS指标） 3. [执行层] JavaScript阻塞（Long Tasks监控） 4. [缓存层] 静态资源配置不当（对比首次/二次加载速度）
二、测试工程师必备排查工具包
1. Chrome DevTools 关键指标
-
Network面板：
-
检查
Waiting (TTFB)是否正常（正常<100ms） -
查看资源瀑布图，定位
Content Download耗时长的文件
-
-
Performance面板：
-
录制加载过程，关注红色三角警告（Long Tasks）
-
检查
Layout Shift（突然的页面元素移位）
-
2. 前端专项检测工具
# 使用Lighthouse进行性能评分（重点
