前端中的强缓存与协商缓存

强缓存:是直接从本地缓存中加载资源,不向服务器发起请求,除非过期了。这种方式可以减少网络延迟,提高页面加载速度,但无法保证资源的最新性

复制代码
皮一下 :
不管你咋样,我都不搭理你,除非我真的无聊了,任性不?

协商缓存:会在加载资源时先询问服务器,如果资源未更改,直接从本地缓存加载 ;如果资源已更改,则重新从服务器加载。这种方式可以确保使用最新资源,但可能会增加网络延迟。

复制代码
皮一下 :
每次都看你一眼,你变强了,我们聊一下,否则继续不理你,现实不?

使用场景

强缓存通常用于减少网络延迟,提高页面加载速度,适用于访问量较大且资源变化不频繁的情况。

协商缓存则适用于需要确保始终使用最新资源的情况,适用于资源变化频繁或需要根据用户个性化需求加载不同资源的情况。

常见场景

常见配置

html配置为不缓存(nostore),其余静态资源配置为强缓存 (max-age)。

为什么?

html页面不缓存保证拿到最新资源另外构建工具可以达到有修改的静态资源hash会有变动,没有改动的静态资源hash不变,两者结合能最大限度的增加缓存命中

复制代码
皮一下

不缓存 (死活不理你)
cache-control: nostore

强缓存(按需理你)
cache-control:max-age=2592000

协商缓存(试探性理你
cache-control : nocache
相关推荐
历程里程碑1 小时前
链表--LRU缓存
大数据·数据结构·elasticsearch·链表·搜索引擎·缓存
balmtv1 小时前
GPT vs Gemini 架构硬核对决:MoE路由、KV缓存与长上下文推理工程实现深度
gpt·缓存·架构
q5431470871 小时前
Window下Redis的安装和部署详细图文教程(Redis的安装和可视化工具的使用)
数据库·redis·缓存
xkxnq2 小时前
第六阶段:Vue生态高级整合与优化(第96天) Vue i18n优化:语言包按需加载+缓存当前语言+避免页面刷新失效
前端·vue.js·缓存
zjeweler3 小时前
redis_tools_gui_v1.2 —Redis图形化漏洞利用工具
数据库·redis·web安全·缓存·安全性测试
夜空下的星3 小时前
使用redisson操作redis详解
数据库·redis·缓存
weixin_456321643 小时前
生产环境Redis部署选型最佳实践
数据库·redis·缓存
FL4m3Y4n3 小时前
Redis相关命令与原理
数据库·redis·缓存
heimeiyingwang3 小时前
【架构实战】缓存架构 Redis 集群部署
redis·缓存·架构
Augustine Electra16 小时前
Flutter 三方库 memoize 的鸿蒙化实战 - 引入极简缓存引擎,避免重复计算,大幅提升鸿蒙应用渲染性能,让你的高刷体验更稳更丝滑。
flutter·缓存·harmonyos