1. 检查网络请求状态
- 按`F12`
打开开发者工具→切换到“Network”面板，刷新页面（`Ctrl+R`）查看所有资源加载情况。
- 按状态码排序（点击“Status”列），优先解决标红的404/500错误（如缺失图片或脚本文件）。
2. 禁用不必要的资源加载
- 在“Network”面板中，右键点击非关键资源（如广告、追踪脚本）→“Block Request”（阻止重复加载）。
- 进入“Sources”面板→“Initiator”筛选器，取消勾选“Other”类别（减少无关事件触发的请求）。
3. 压缩网页内容
- 在“Network”面板中找到HTML主文档，右键点击→“Copy”→“Copy URL”，在地址栏添加`?compress=1`参数（部分网站支持手动压缩）。
- 使用“Webpage Screenshot”扩展，将页面保存为PDF后重新上传（自动压缩图片和文本）。
4. 优化缓存策略
- 在“Network”面板中查看缓存命中率（按类型排序），右键点击可缓存资源→“Clear Cache”后刷新测试。
- 进入“Application”面板→“Manifest”文件，修改缓存规则（如延长图片缓存时间至7天）。
5. 加速DOM渲染
- 在“Elements”面板中，删除无用的嵌套标签（如多层div），保留核心结构（如header+main）。
- 右键点击复杂动画元素→“Delete element”，改用CSS简化动效（如`transform: rotate()`替代JavaScript逐帧渲染）。
6. 减少重绘和回流
- 在“Styles”面板中，批量修改
字体大小和颜色（避免频繁触发布局变化）。
- 使用“Rendering”面板→“Paint Flashing”功能，高亮显示需要重绘的区域并优化（如合并多层背景）。
7. 启用Brotli压缩
- 在地址栏输入`chrome://flags/enable-brotli`，强制浏览器请求Brotli压缩的文本资源（比gzip更高效）。
- 检查“Network”面板中的文本文件（如HTML/CSS/JS），确认Content-Encoding显示为br。
8. 预加载关键资源
- 在HTML源码中插入link rel="preload" href="style.css"（提前加载样式表）。
- 使用“Lighthouse”报告→“Performance”板块，扫描未预加载的关键资源并手动添加标签。
9. 修复Lazy Loading问题
- 在“Console”面板中搜索“IntersectionObserver”错误，检查图片img标签是否包含`loading="lazy"`属性。
- 在
开发者工具手机模式（`Ctrl+Shift+M`）下，测试滚动时是否出现空白占位（调整图片尺寸或延迟加载策略）。
10. 清理冗余扩展程序
- 进入扩展管理页面（`chrome://extensions/`），禁用
广告拦截类插件（可能拦截必要脚本）。
- 在“Background”页签中，关闭占用CPU的扩展进程（如自动翻译工具）。
