微信小程序性能优化之HTTP缓存

微信小程序性能优化

我们可以通过小程序开发工具上的Audits对自己的小程序进行评分,会显示出有缺陷的部分

网络图片资源未开启HTTP缓存控制

简单的来说,就是官方建议你进行缓存,再次加载的时候访问缓存来提升加载速度

HTTP缓存

简单的来说,就是进行http请求的时候,会先找本地的缓存,如果本地缓存存在,就加载本地缓存;如果本地不存在,就去请求服务器。

这样做的好处有:

  1. 加载本地资源速度更快
  2. 降低服务器负担

举个例子就是,你要吃水果的时候,会先在自己家的冰箱找,自己冰箱没有的话再去超市买

缓存控制

HTTP的缓存控制分为两种,一种是强缓存,一种是协商缓存

强缓存:

就是进行HTTP请求的时候,先查找本地缓存,根据 “时效”判断本地缓存是否过期,如果过期了,就得重新请求服务器,否则就使用本地缓存

协商缓存:

进行HTTP请求的时候,先查找本地,如果本地缓存过期,我就拿本地缓存的某个标识去请求服务器,服务器判断你请求发送的标识和它自己的是否一致,如果一致,表示资源没变化,你本地的缓存资源还可以继续使用。如果一致,服务器会返回304;如果不一致,会返回新资源

强缓存相关字段

参考1
参考2
参考3

与强缓存的三个字段有:Pragma,Expires,Cache-Control

Pragma说是旧时产物,逐渐被抛弃了,而且参考的博客中也是主要分析了Expires和Cache-control。

Expires:过期时间,超出这个时间缓存就过期了,但是这个时间可以说是服务器返回的,但是本地时间与服务器时间可能有误差

Cache-Control:优先级比Expires高,两个都存在的时候,以Cache-Control为准。这是一个相对时间,相对于你缓存到本地后,多久后会过期

协商缓存相关字段

两个字段:ETag和 If-None-Match

这两个都是服务器为每一个资源分配的唯一标识

  1. 首次请求服务器,服务器响应在响应头中返回ETag
  2. 再次请求服务器,会添加If-None-Match字段,值是ETag的值;服务器对比请求过来的If-None-Match的值和ETag的值是否一致,一致则表示资源没有更新,返回304,并把此时的ETag的值返回,哪怕是一致的
两个字段Last-Modified和If-Modified-Since

效果和过程和ETag那两个差不多,但是这个就不是唯一标识了,而是资源的最后修改时间

服务端也是比较最后修改时间

ETag和Last-Modified的区别

简单来说,就是有时候修改时间变了,但是内容没变;或者服务器不能精确到文件的最后修改时间。此时使用ETag是有优势的

用户操作对字段影响

在这里插入图片描述

发布了127 篇原创文章 · 获赞 3 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/u010513497/article/details/103987926