HTTP:强缓存优化实践

强缓存:浏览器不会向服务器发送任何请求,直接从本地缓存中读取文件

强缓存是指浏览器在向服务器请求资源时,判断本地是否存在该资源的缓存,并判断是否过期。

如果本地缓存未过期,浏览器就直接使用本地缓存,而不会向服务器发送请求。

这样可以减少对服务器的请求,加快页面加载速度。

用流程图描述如下:

强缓存通常通过HTTP响应头的 ExpiresCache-Control 实现:

1、Expires :服务端返回的响应中包含一个 Expires 头,指定资源缓存的过期时间。例如:

bash 复制代码
Expires: Wed, 21 Oct 2024 07:28:00 GMT

浏览器中获取到的状态码有两种,优先级上 memory cache(内存缓存) > disk cache(磁盘缓存)

bash 复制代码
// 资源存储在内存中的缓存。这样的缓存读取速度非常快,但相对容量较小。
1、 Status Code: 200 OK (form memory cache)

// 资源存储在硬盘上的缓存。磁盘缓存可以存储更多的数据,但相对读取速度较慢
2、 Status Code: 200 OK (from disk cache)

浏览器在接收到带有 Expires 头的响应后,会将资源保存在缓存中,并在过期时间之前不会再次向服务器发送请求。

因为 Expires 值是一个固定时间,因此会受本地时间的影响,如果在缓存期间我们修改了本地时间,可能会导致缓存失效。

2、Cache-Control :使用 Cache-Control 头的 max-age 来设置资源的过期时间(单位为秒)。例如:

bash 复制代码
Cache-Control: max-age=3600

这表示资源将在 3600 秒(1 小时)后过期。浏览器收到包含 max-age 的响应后,会根据该值在本地进行缓存,并在过期之前不再向服务器发送请求该资源。

相关推荐
VVVVWeiYee33 分钟前
项目2路由交换
运维·服务器·网络·网络协议·信息与通信
手心里的白日梦6 小时前
UDP传输层通信协议详解
网络·网络协议·udp
红米饭配南瓜汤6 小时前
WebRTC服务质量(11)- Pacer机制(03) IntervalBudget
网络·网络协议·音视频·webrtc·媒体
萧瑟其中~9 小时前
计算机网络:TCP/IP网络协议
网络协议·tcp/ip·计算机网络
梦境之冢13 小时前
axios 常见的content-type、responseType有哪些?
前端·javascript·http
DashVector13 小时前
如何通过HTTP API检索Doc
数据库·人工智能·http·阿里云·数据库开发·向量检索
哈利巴多先生13 小时前
HTTP,续~
网络·网络协议·http
白了个白i13 小时前
http的访问过程或者访问页面会发生什么
网络·网络协议·http
qq_3720068614 小时前
浏览器http缓存问题
网络协议·http·缓存
科技小E15 小时前
国标GB28181设备管理软件EasyGBS:P2P远程访问故障排查指南(设备端)
网络协议·智能路由器·音视频·p2p