memoryCache 和 diskCache 的相关总结

一、缓存位置

　　在浏览器开发者工具的 Network 的 Size 栏会出现的三种情况：

• from Service Worker
• from memory cache
• from disk cache
• 真正的网络请求（显示资源的具体大小，示例：15.6KB）

　　1、Service Worker
　　本质是作为服务器与客户端之间的代理服务器，伴随着PWA出现。Service Worker真正意义上将缓存控制权交给了前端，相比于LocalStorage、SessionStorage，后两者只是单纯的接口数据缓存，例如用户信息（一个对象）、列表信息（一个数组），而前者可以缓存静态资源，甚至拦截网络请求，根据网络状况作出不同的缓存策略。

　　注：不访问服务器，直接读缓存，不请求网络资源，从内存中读取缓存。此时的数据时缓存到内存中的，当kill进程后，数据将不存在

　　2、memory cache
　　将资源缓存在了内存中。事实上，所有的网络请求都会被浏览器缓存到内存中，当然，内存容量有限，缓存不能无限存放在内存中，因此，注定是个短期缓存。
内存缓存的控制权在浏览器，前后端都不能干涉（前端人员可以控制某些图片不进行缓存）。

　　注：不访问服务器，直接读缓存，不请求网络资源，从磁盘中读取缓存，当kill进程时，数据还是存在。

　　3、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）