前言
在经历看了忘,忘了看的痛苦后 终于下定决心写博客 给自己做总结
这些内容都是我看了多人的博客后,做的小小总结
主要是给自己复习用,加深记忆
1.浏览器为什么需要缓存?
良好的缓存策略可以降低资源的重复加载提高网页的整体加载速度
白话文:
我已经加载过这个网页了 有些没变动的资源我再次发请求 没有意义
实属浪费流量 浪费时间 浪费人生
2.缓存放在哪里了?
内存和磁盘或者离线缓存和推送缓存(HTTP2.0)
①Service Worker Cache(离线缓存)
讲道理 我到现在 都不是很明白 这是啥? 恕我等级太低
等我有时间一定去搞懂它(其实也不愿意去看 狗头.jpg)
但是它还是有几个作用的
②Memory Cache (内存缓存)
效率快 存活时间短
③Disk Cache (磁盘缓存)
存储容量大 储存时间长 那么相对来说 效率就没内存缓存块了
④Push Cache (推送缓存)
这是HTTP 2.0中的内容 我还是不懂…
那么我就知道了 比较大的JS CSS文件就会丢到 磁盘缓存中
或者说内存不够的时候 也会丢到磁盘缓存中
3.缓存有哪些类型?
①强缓存 (不需要发送http请求)
HTTP 1.0时期 用的是 Expires字段判断 (过期时间)
Expires: Wed, 22 Nov 2019 08:41:00 GMT
这样会有个弊端 如果你计算机本地更改了时间 就会导致判断不正确
HTTP 1.1时期 用的是 Cache-control字段判断 (过期时长)
max-age: 过期时长
Cache-Control:max-age=3600 //意味着3600秒内 可以直接使用缓存
Cache-Control 还有这些字段
private: 这种情况就是只有浏览器能缓存了,中间的代理服务器不能缓存。
no-cache: 跳过当前的强缓存,发送HTTP请求,即直接进入协商缓存阶段。
no-store:非常粗暴,不进行任何形式的缓存。
②协商缓存(发HTTP请求 如无变动 返回304)
Last-Modified (时间)
如果浏览器收到服务器 资源中有这个字段
再给服务器发送时 会带上 If-Modified-Since这个字段
那么服务器收到时 就会进行比对
Etag (内容)
那么同理
浏览器 给服务器发送 会带上If-None-Match这个字段 存放资源
那么服务器 会进行比对
如果都有 那么会优先用 Etag 它也更精准一些 因为它是对内容进行对比
但性能上来说 Last-Modified 要更好一点 因为它就记录个时间点