高并发-浏览器缓存和压缩优化

2020-03-31  本文已影响0人  AGEGG

HTTP缓存机制

启用浏览器缓存

缓存分类

HTTP缓存模型中,如果请求成功会有三种情况
1.200 from cache:直接从本地缓存中获取响应,最快速,最省流量,因为根本没有向服务器发送请求
2.304 Not Modified:协商缓存,浏览器在本地没有命中的情况下请求头中发送一定的校验数据到服务端,如果服务端数据没有改变浏览器从本地缓存响应,返回304
快速,发送的数据很少,只返回一些基本响应头信息,数据量很小,不发送实际响应体
3.200 OK:以上两种缓存全部都失败,服务器返回完整响应。没有用到缓存,相对最慢

本地缓存

相关Header

Cache-Control

no-store:禁止浏览器缓存响应
no-cache:不允许直接使用本地缓存,先发起请求和服务器协商
max-age = delta-seconds:告知浏览器该响应本地缓存有效的最长期限,以秒为单位
优先级:Pragma > Cache-Control > Expires

协商缓存

当浏览器没有命中本地缓存,如本地缓存过期或者响应中声明不允许直接使用本地缓,那么浏览器肯定会发起服务端请求
服务端会验证数据是否修改,如果没有通知浏览器使用本地缓存

相关Header

Last-Modified:通知浏览器资源的最后修改时间
Last-Modified:Mon,28 Sep 2015 08:06:43 GMT
If-Modified-Since:得到资源的最后修改时间后,会将这个信息通过If-Modified-Since提交到服务器做检查,如果没有修改,返回304状态码
ETag:HTTP1.1推出,文件的指纹标识符,如果文件内容修改,指纹会改变
Etag:“78437822c-6739”
If-None-Match:本地缓存失效,会携带此值去请求服务端,服务端判断该资源是否改变,如果没有改变,直接使用本地缓存,返回304
If-None-Match:“78437822c-6739”

缓存策略选择

适合缓存的内容

不变的图像,如logo图标等
js、css静态文件
可下载的内容,媒体文件

建议使用协商缓存

HTML文件
经常替换的图片
经常修改的js、css文件
js、css文件的加载可以加入文件的签名来拒绝缓存
index.css?签名
index.签名.js

不建议缓存的内容

用户隐私等敏感数据
经常改变的api数据接口

Nginx配置缓存策略

本地缓存配置

add_header指令:添加状态码为2XX和3XX的响应头信息
add_header name value[always];
可以设置Pragma/Expires/Cache-Control,可以继承
expires指令:通知浏览器过期时长
expires time; //time 可以是秒可以是分钟

上一篇下一篇

猜你喜欢

热点阅读