浏览器的缓存方式几种

浏览器的缓存方式主要分为以下几种:


1. 强制缓存(强缓存 / Memory Cache & Disk Cache)

  • 通过 Expires 或 Cache-Control 头部控制。
  • 在缓存有效期内,浏览器直接使用缓存,不发起请求。

关键HTTP头:

  • Expires: Wed, 21 Oct 2025 07:28:00 GMT(绝对时间,容易受客户端时间影响)
  • Cache-Control: max-age=3600, public(相对时间,推荐使用)

存储位置:

  • Memory Cache(内存缓存):用于短时间内频繁访问的资源(如当前页面的 CSS、JS)。
  • Disk Cache(磁盘缓存):用于存储较大的资源,关闭页面后仍然有效。

2. 协商缓存(弱缓存 / ETag & Last-Modified)

  • 如果强缓存失效,浏览器会发送请求,并通过协商缓存判断资源是否更新。
  • 如果资源未更新,服务器返回 304 Not Modified,浏览器继续使用缓存的资源。

关键HTTP头:

  • Last-Modified(资源的最后修改时间) & If-Modified-Since
  • ETag(资源的唯一标识符) & If-None-Match

3. Service Worker 缓存

  • Service Worker 作为浏览器的代理,拦截请求并返回缓存,适用于 PWA(渐进式Web应用)。
  • 可用 Cache API 控制哪些资源缓存、如何更新。

4. 浏览器存储(LocalStorage / SessionStorage / IndexedDB)

  • LocalStorage:持久化存储,关闭页面或浏览器不会丢失数据。
  • SessionStorage:会话级存储,页面关闭后数据丢失。
  • IndexedDB:适用于存储大量数据,如 JSON 对象。

5. Push Cache(HTTP/2 推送缓存)

  • 仅限 HTTP/2 使用,服务器可以主动推送资源到客户端缓存,但 生命周期很短,仅在会话(Session)内有效。

总结

缓存方式 是否需要请求 过期控制 适用场景
强缓存 否 Cache-Control / Expires 资源不变更,减少请求
协商缓存 是 ETag / Last-Modified 资源可能变更
Service Worker 否 自定义缓存规则 PWA、离线缓存
浏览器存储 否 自己控制 存储 JSON、用户设置
Push Cache 否 仅会话内有效 HTTP/2 服务器推送

你可以根据需求选择合适的缓存策略!🚀

相关推荐
程序猿编码4 小时前
纯 C++ 手写 LLM 推理引擎:分页 KV 缓存、连续批、多卡张量并行全部内置
c++·深度学习·缓存·大模型推理·自动微分·模型推理
code2cat4 小时前
【随笔】RAG检索缓存:复用证据之前,先把权限和版本放进缓存键
java·人工智能·缓存·知识库·rag
牧瀬クリスだ8 小时前
Redis五大数据类型全解析:从入门到实战
java·数据库·redis·后端·缓存
讯捷蓝达9 小时前
HPE Nimble CS3000存储,断电恢复后,双控缓存异常,存储卷无法正常启动
缓存
Lucis__20 小时前
Redis持久化机制解析
redis·缓存·操作系统·文件·非关系型数据库·1024程序员节
李纲明21 小时前
WordPress 后台登录马上被踢回登录页:Cookie 域、HTTPS、盐值和页面缓存怎么查
运维·缓存·https·php·wordpress·cookie
码士集团小青1 天前
面霸篇:高频 Java 基础问题(核心卷一)
linux·服务器·数据库·redis·缓存·1024程序员节
一条泥憨鱼1 天前
【Redis | 黑马点评】附近商铺功能源码解读
数据库·redis·缓存
小南家的青蛙1 天前
Redis的资料
redis·缓存·1024程序员节
深圳市恒星物联科技有限公司1 天前
排水管网监测后期运维成本高吗?成本构成与控制策略分析
运维·缓存