浏览器有哪几种缓存?各种缓存之间的优先级

在浏览器中,有以下几种常见的缓存:

1、强制缓存 :通过设置 Cache-Control 和 Expires 等响应头实现,可以让浏览器直接从本地缓存中读取资源而不发起请求。
2、协商缓存: 通过设置 Last-Modified 和 ETag 等响应头实现,可以让浏览器发送条件请求,询问服务器是否有更新的资源。如果服务器返回 304 Not Modified 响应,则表示客户端本地缓存仍然有效,可直接使用缓存的资源。
3、Service Worker 缓存: Service Worker 是一种特殊的 JS 脚本,可以拦截网络请求并返回缓存的响应,以实现离线访问和更快的加载速度等功能。
**4、Web Storage 缓存:**包括 localStorage 和 sessionStorage。localStorage 用于存储用户在网站上的永久性数据,而 sessionStorage 则用于存储用户会话过程中的临时数据。

优先级:

1、Service Worker 缓存: 由于其可以完全控制网络请求,因此具有最高的优先级,即使是强制缓存也可以被它所覆盖。
2、强制缓存: 如果存在强制缓存,并且缓存没有过期,则直接使用缓存,不需要向服务器发送请求。
3、协商缓存: 如果强制缓存未命中,但协商缓存可用,则会向服务器发送条件请求,询问资源是否更新。如果服务器返回 304 Not Modified 响应,则直接使用缓存。
**4、Web Storage 缓存:**Web Storage 缓存的优先级最低,只有在网络不可用或者其他缓存都未命中时才会生效。

相关推荐
kyriewen4 分钟前
前端切图仔被 AI 新闻淹死的第 N 天,我用 TRAE Work 定时任务救了自己
前端·人工智能·trae
京东云开发者5 分钟前
【全栈实践】第一个 AI Agent 项目:从零搭建 AI 音频创作助手(高级篇)
前端·agent·音视频开发
AbrahamCS22 分钟前
从角色协同到可运行图:Graph Engineer 与多智能体编排
前端·人工智能·智能体
BigTopOne33 分钟前
VS Code IntelliSense 配置(解决 #include 找不到的报红)
前端
愚公搬代码35 分钟前
【愚公系列】《Web应用安全》005-Visual Studio Code编辑器的使用
前端·安全·编辑器
用户9210802628638 分钟前
2. 以 Bubble 为例,看 Ant Design X Vue 组件是怎么设计的
前端
Liora_Yvonne40 分钟前
Monorepo 里的 shared、services 和 ui 到底怎么划分?
前端
PedroQue9943 分钟前
uni-router v2.1.0 升级:导航守卫全面支持返回值模式
前端·uni-app
野生技术架构师1 小时前
Redis 和 MySQL 如何保证数据一致性?先更新数据库还是先删缓存,延迟双删、MQ、Canal 一次讲透
数据库·redis·缓存
猫七先生1 小时前
从零到一:个人博客自动化部署踩坑全记录
前端