教程详情
- 内存缓存：临时保存网页渲染数据（如HTML、CSS、JS）→仅在本次会话有效→关闭标签页后自动释放。
- 磁盘缓存：长期存储静态资源（如图片、脚本文件）→路径为`C:\Users\[用户名]\AppData\Local\Google\Chrome\User Data\Default\Cache`→文件按哈希值命名便于快速匹配。
- IndexedDB存储：对复杂数据（如Web SQL数据库内容）进行结构化缓存→通过`chrome://indexdb/`页面查看并清理过期数据。
2. 缓存读取优先级规则
- 首次请求：访问新网站时→完整下载所有资源→存入内存和磁盘缓存。
- 再次访问：优先从内存缓存读取→若失效则查询磁盘缓存→最后才向服务器发送带If-Modified-Since头的请求验证资源是否更新。
- 缓存键生成：基于资源URL、HTTP头部（如ETag、Last-Modified）、请求方法（GET/POST）综合生成唯一标识→确保不同版本资源独立存储。
3. 影响缓存有效性的关键因素
- HTTP头部控制：`Cache-Control: no-cache`强制每次验证资源→`Expires`头设置绝对过期时间→`Pragma`头兼容HTTP/1.0缓存规则。
- Cookie作用：如果请求携带Cookie（如用户登录态）→服务器可能返回`Set-Cookie`导致缓存失效→可通过分离静态资源域名避免Cookie污染。
- 304状态码：当资源未修改时→服务器返回304 Not Modified→浏览器直接使用本地缓存副本→减少带宽消耗（需确保服务器正确处理ETag或Last-Modified头）。
4. 手动清理与空间回收策略
- 单站点缓存清理：在地址栏输入`chrome://cache/`→输入站点URL（如`https://example.com`）→点击“清除缓存”按钮→仅删除该域名相关文件。
- 全盘缓存释放：按`Ctrl+Shift+Del`→勾选“缓存图像和其他文件”→选择清理时间范围（如过去一周）→确认后删除所有非永久缓存数据。
- 自动过期机制：Chrome定期检查磁盘缓存中文件的最后访问时间→超过30天未使用的文件会被系统自动标记为可删除→重启浏览器时清理。
5. 优化网页性能的缓存配置技巧
- 静态资源版本化：在文件名中添加哈希值（如`style.abc123.css`）→强制浏览器跳过缓存获取最新版本。
- Service Worker干预：通过`registerServiceWorker.js`拦截请求→缓存关键页面（如`offline.`）→自定义缓存过期逻辑（如设置7天刷新周期）。
- 压缩资源体积：启用Brotli压缩（`.br`文件）→减少传输数据量→提升缓存命中率（需服务器和浏览器同时支持）。
