浏览器强缓存与协商缓存
浏览器缓存过程
当用户在浏览器中输入url后，浏览器首先会查看缓存中是否有相应资源，若有则需要判断缓存的资源是否过期，主要通过cache-control和expires字段来判断，若没有过期则直接使用该资源，该过程就是强缓存；若资源过期了则再向服务器发起请求，并在请求头中带上初次请求该资源时响应头中的Last-Modified字段作为IF-Modified-Since 或者 Etag字段作为 IF-None-Match向服务器发送请求，服务器通过该字段来判断资源是否过期，若没有过期则返回304状态码，浏览器直接从缓存中取；若过期则更新响应头中缓存有关字段并将最新的资源返回给浏览器，浏览器将最新的资源缓存，这个过程就是协商缓存。
借用网上一张图片：
强缓存
强缓存根据资源响应头中的Cache-Control和Expires字段来进行控制。
-
Expires字段是一个GMT格式的时间字符串，例如Expires: Thu, 11 Jun 2020 17:19:25 GMT。该时间是一个过期时间点，表示在这个时间点资源会过期，此时就需要重新发送请求。但是服务器的时间和客户端时间不是一定相同的，而且用户可以对客户端时间进行更改，这会导致该字段不准确。 -
Cache-Control中的max-age字段可用于判断资源是否过期，max-age为一个有效时间，例如Cache-Control: max-age=3600表示获取到该资源后该资源的有效时间为3600秒，若超过这个时间后则需走协商缓存。下面是Cache-Control的一些其他字段：-
no-cache：不使用本地缓存，但是会使用协商缓存。 -
no-store: 不使用缓存，即每次都去服务器请求该资源。 -
public: 表明所有的用户在通过缓存服务器的时候，都可以缓存这个资源。 -
private: 表明只有某个在通过缓存服务器的时候，得到缓存资源。
-
当Expires和Cache-Control同时存在时Cache-Control优先级更高。
协商缓存
-
Last-Modified/If-Modified-Since,两个字段都为GTM格式的字符串，Last-Modified代表该资源最后的修改时间，用户初次请求该资源时响应头中可以设置该字段，当再次请求该资源若没有命中强缓存则会在请求头中设置If-Modified-Since字段为Last-Modified字段的值向服务器发送请求，服务器根据该资源的最后修改时间和If-Modified-Since字段进行比较来判断资源是否修改过，若没有修改则返回304状态码，否则返回修改过的资源并设置新的缓存信息。 -
Etag/If-None-Match: Etag字段为服务器为资源生成的唯一表示字符串，当资源发生改变后该字段也会改变。同样的当进行协商缓存时将Etag设置给If-None-Match字段，服务器来判断该资源的唯一标识字符串与该字段是否相同，相同则命中协商缓存返回304，否则返回修改过的资源并设置新的缓存信息。 -
Etag字段优先级大于Last-Modified。
Last-Modified/If-Modified-Since缺陷
- 若请求资源只是被重新上传，内容并未改变，此时
Last-Modified字段会被修改，请求该资源时不会走缓存。 - 若在1秒内多次修改资源，
If-Modified-Since字段和资源的最后修改时间进行比较时并不会察觉到资源的变化。
缓存字段优先级
Cache-Control > Expires > Etag > Last-Modified
memroy cache和disk cache
-
memory cache(内存缓存)和disk cache(磁盘缓存)都为强缓存，memory cache更加的快，因为是cpu从内存中直接读取的，而disk cache需先将资源读取到内存中再给cpu处理。当用户初次访问资源后会被缓存到浏览器中，使用f5刷新页面时会从memory cache中读取缓存；当关闭浏览器再次打开资源时会从disk cache中读取缓存。
从内存缓存读取：
从磁盘缓存中读取：
三级缓存原理
-
先去内存看，如果有，直接加载
-
如果内存没有，择取硬盘获取，如果有直接加载
-
如果硬盘也没有，那么就进行网络请求
-
加载到的资源缓存到硬盘和内存
比如：访问图片-> 200 -> 退出浏览器
再进来-> 200(from disk cache) -> 刷新 -> 200(from memory cache)