一、核心检测工具与操作步骤
1. 基础网络诊断
- 在Chrome右上角菜单中选择“更多工具”→“开发者工具”→切换到Network面板（按`F5`刷新页面查看资源加载状态）
- 通过开发者工具Console面板输入`performance.getEntriesByType('resource').forEach(e => console.log(e.startTime))`输出资源加载时间线
- 安装扩展商店的WebPageTest插件生成`https://example.com?Mobile=1&Connection=Cable`测试链接（模拟不同网络环境）
2. 深度性能分析
- 使用扩展商店的Lighthouse插件运行审计（重点关注“首次内容绘制”和“速度指数”指标）
- 在地址栏输入`chrome://system/`查看网络服务进程（如发现`network_service`占用过高需结束进程）
- 通过开发者工具Performance面板录制加载过程，右键点击“Reload”按钮选择“清除缓存并重启”对比优化前后数据
3. 缓存与DNS问题处理
- 在Chrome右上角菜单中选择“设置”→“隐私设置和安全性”→点击“清除浏览数据”勾选“缓存图像和文件”及“托管应用数据”
- 通过开发者工具Application面板删除IndexedDB和LocalStorage中的过期数据（如`https://example.com`域名下存储）
- 在Console面板输入`chrome.dnsCache.clear()`强制刷新DNS缓存（需配合`--disable-dns-prefetching`启动参数）