乐趣区

关于前端:前端缓存

缓存分类

  1. HTTP 缓存
  2. 浏览器缓存

HTTP 缓存

http 缓存次要是在申请服务器资源时对资源进行的缓存解决,次要蕴含强缓存和协商缓存

http 申请缓存步骤:

  1. 发动申请
  2. 在浏览器中查找是否存在缓存
  3. 没有缓存,则间接发动 http 申请
  4. 存在缓存,判断缓存是否生效,通过 Cache-Control、Expire
  5. 生效,则申请协商缓存,即通过 Etag 或者 Last-Modified
强缓存

强缓存即在浏览器中查找缓存内容,如果缓存内容不生效,则间接应用改缓存后果

缓存是否生效通过申请头中 Expire 和 Cache-Control 进行判断,会在响应头中返回,Cache-Control 的优先级高于 Expire,如图:

强缓存资源缓存地位次要有 memory cache, disk cache, Service Worker 等,浏览器查找缓存时会先查找 Service Worker,而后查找 memory cache,最初查找 disk cache

  • memory cache 资源存储在内存中,查找时间短,存储工夫短
  • disk cache 资源存储在硬盘中,查找时间长,能够长久存储
  • service worker 独自存储在一个地位,长久存储
协商缓存

强缓存获取失败后,会发动协商缓存的申请,申请头部携带 Etag 或者 Last-Modified 缓存标记,由服务器判断是否应用缓存,etag 优先级高于 Last-Modified

浏览器缓存

本地缓存

  1. cookie 4k 左右
  2. localstorage 5M 左右
  3. sessionStorage 5M 左右
  4. indexDB 等大容量存储 50M 左右
退出移动版