第 35 题：请求时浏览器缓存 from memory cache 和 from disk cache 的依据是什么，哪些数据什么时候存放在 Memory Cache 和 Disk Cache中？

Question

从缓存位置上来说分为四种：

• Service Worker
• Memory Cache
• Disk Cache
• Push Cache

如果以上四种缓存都没有命中的话，那么只能发起请求来获取资源了。

memory cache

Memory Cache 也就是内存中的缓存

• 优点：读取速度快
• 缺点：一旦我们关闭 Tab 页面，内存中的缓存也就被释放了。
• 如何触发：当我们访问过页面以后，再次刷新页面，可以发现很多数据都来自于内存缓存

disk cache

Disk Cache 也就是存储在硬盘中的缓存

优点：缓存再硬盘中，容量大

缺点：读取速度满

如何触发：根据浏览器请求头

Service Worker

Service Worker 是运行在浏览器背后的独立线程，一般可以用来实现缓存功能。传输协议必须为 HTTPS，Service Worker 的缓存与浏览器其他内建的缓存机制不同，它可以让我们自由控制缓存哪些文件、如何匹配缓存、如何读取缓存，并且缓存是持续性的。

这个我们不常用

Push Cache

Push Cache（推送缓存）是 HTTP/2 中的内容，当以上三种缓存都没有命中时，它才会被使用。它只在会话（Session）中存在，一旦会话结束就被释放，并且缓存时间也很短暂

这个我们不常用。

Answer 1

浏览器缓存机制 脑图
https://note.youdao.com/ynoteshare1/index.html?id=4dccda61e585dddd0e5749fef143c7a5&type=note

Answer 2

掘金上这篇文章讲缓存的讲的条理更清晰
一文读懂前端缓存

Answer 3

不对,我自己试过,如果service-work和强缓存同时存在的话, PC上是service-work为主;但是移动端,是以强缓存为主的,我测试的是service-work采用 StaleWhileRevalidate策略,pc上会随着文件更新而下次更新,但是移动端上,不到强缓存时间,是不理会service-work的

Answer 4

浏览器会把哪些文件丢进内存(Memory Cache)中？哪些丢进硬盘(Disk Cache)中？
关于这点，网上说法不一，不过以下观点比较靠得住：

• 对于大文件来说，大概率是不存储在内存中的，反之优先
• 当前系统内存使用率高的话，文件优先存储进硬盘

上述内容来自 https://www.jianshu.com/p/54cc04190252

Answer 5

这个其实就是强缓存和协商缓存的问题，强缓存会直接去取缓存的文件，而协商缓存会去像服务器发送一次确认文档是否有效的请求。

Answer 6

对于第一个问题前面的文章都说得很详细了我这里就不再赘述
第二个问题可以参考我写的博文 命中强制缓存时，该从哪拿缓存小节。
总的来说：

1. 如果开启了Service Worker首先会从Service Worker中拿
2. 如果新开一个以前打开过的页面缓存会从Disk Cache中拿（前提是命中强缓存）
3. 刷新当前页面时浏览器会根据当前运行环境内存来决定是从 Memory Cache 还是 从Disk Cache中拿(可以看到下图最后几个文件有时候是从 Memory Cache中拿有时候是从Disk Cache中拿)
   

注意：以上回答全部基于chrome浏览器

Answer 7

大家还是没有说清楚，缓存在什么情况下保存什么位置啊

Answer 8

https://www.jianshu.com/p/54cc04190252
浏览器的缓存机制

这篇完美~

Answer 9

四种浏览器缓存的故事

Answer 10

https://www.jianshu.com/p/54cc04190252
浏览器的缓存机制

Answer 11

参考：【缓存】HTML5缓存的那些事