一、缓存位置
在浏览器开发者工具的 Network 的 Size 栏会出现的三种情况：
- from Service Worker
- from memory cache
- from disk cache
- 真正的网络请求（显示资源的具体大小，示例：15.6KB）
1、Service Worker
本质是作为服务器与客户端之间的代理服务器，伴随着PWA出现。Service Worker真正意义上将缓存控制权交给了前端，相比于LocalStorage、SessionStorage，后两者只是单纯的接口数据缓存，例如用户信息（一个对象）、列表信息（一个数组），而前者可以缓存静态资源，甚至拦截网络请求，根据网络状况作出不同的缓存策略。
本质是作为服务器与客户端之间的代理服务器，伴随着PWA出现。Service Worker真正意义上将缓存控制权交给了前端，相比于LocalStorage、SessionStorage，后两者只是单纯的接口数据缓存，例如用户信息（一个对象）、列表信息（一个数组），而前者可以缓存静态资源，甚至拦截网络请求，根据网络状况作出不同的缓存策略。
注：不访问服务器，直接读缓存，不请求网络资源，从内存中读取缓存。此时的数据时缓存到内存中的，当kill进程后，数据将不存在
2、memory cache
将资源缓存在了内存中。事实上，所有的网络请求都会被浏览器缓存到内存中，当然，内存容量有限，缓存不能无限存放在内存中，因此，注定是个短期缓存。
内存缓存的控制权在浏览器，前后端都不能干涉（前端人员可以控制某些图片不进行缓存）。
将资源缓存在了内存中。事实上，所有的网络请求都会被浏览器缓存到内存中，当然，内存容量有限，缓存不能无限存放在内存中，因此，注定是个短期缓存。
内存缓存的控制权在浏览器，前后端都不能干涉（前端人员可以控制某些图片不进行缓存）。
注：不访问服务器，直接读缓存，不请求网络资源，从磁盘中读取缓存，当kill进程时，数据还是存在。
3、disk cache
将资源缓存在硬盘中，disk cache也叫http cahce，因为其严格遵守http响应头字段来判断哪些资源是否要被缓存，哪些资源是否已经过期。绝大多数缓存都是disk cache。硬盘缓存的控制权在后端（一般在服务器中进行设置）
将资源缓存在硬盘中，disk cache也叫http cahce，因为其严格遵守http响应头字段来判断哪些资源是否要被缓存，哪些资源是否已经过期。绝大多数缓存都是disk cache。硬盘缓存的控制权在后端（一般在服务器中进行设置）
二、各自缓存的资源
1、memory cache：一般脚本、字体、图片会存在内存中
2、disk cache：一般非脚本会存在磁盘中，如CSS等
3、资源大小数值：从服务器下载最新资源
4、报文大小：请求服务器发现资源没更新，使用本地资源
三、状态的执行顺序
现加载一种一志愿（例如图片）：访问-->200-->退出浏览器，再进来-->200（from disk cache）-->刷新-->200（from memory cache）