一、基础测试方法
1. 核心指标监测
- 在开发者工具Network面板查看`Time to First Byte`（TTFB）数值
- 使用Performance面板记录`First Contentful Paint`（FCP）耗时
- 通过Audits功能生成Lighthouse报告检查`Speed Index`评分
- 在地址栏输入`chrome://tracing/`启用追踪工具分析渲染流程
2. 资源加载优化
- 在HTML头部添加link rel="preconnect" href="example.com"建立早期连接
- 使用`async`属性异步加载非关键JavaScript文件
- 通过picture标签为不同设备提供适配图像资源
- 在服务器配置中启用Brotli压缩算法（`br`）减少传输体积
3. 缓存策略验证
- 在Chrome设置中的“隐私与安全”部分查看缓存容量限制
- 使用Service Workers缓存静态资源文件（如CSS/JS/图片）
- 通过`Cache-Control: immutable`设置长期缓存策略
- 在扩展商店安装Cache Viewer可视化存储内容