web 前端新手该怎么入门? 浏览器缓存机制是什么? 浏览器缓存就是把一个已经请求过的资源拷贝一份存储起来, 当下次需要该资源时, 浏览器会根据缓存机制决定直接使用缓存资源还是再次向服务器发送请求. 很多 Web 前端学习入门小白好奇浏览器究竟是如何工作的? 它的缓存机制是什么, 接下来小编就给大家介绍一下.
浏览器缓存机制有四个方面, 按照获取资源时请求的优先级依次排列为: Memory Cache,Service Worker Cache,HTTP Cache,Push Cache.
MemoryCache, 是指存在内存中的缓存. 从优先级上来说, 它是浏览器最先尝试去命中的一种缓存. 从效率上来说, 它是响应速度最快的一种缓存. 浏览器秉承的是 "节约原则"Base64 格式的图片永远可以被塞进 memory cache, 这可以视作浏览器为节省渲染开销的 "自保行为". 体积不大的 JS,CSS 文件, 也有较大地被写入内存的几率, 但较大的 JS,CSS 文件就没有这个待遇了.
Service Worker 是一种独立于主线程之外的 JavaScript 线程. 它脱离于浏览器窗体, 因此无法直接访问 DOM. 这样独立的个性使得 Service Worker 的 "个人行为" 无法干扰页面的性能, 能够帮我们实现离线缓存, 消息推送和网络代理等功能.
HTTP Cache, 可分为强缓存和协商缓存. 优先级较高的是强缓存, 在命中强缓存失败的情况下, 才会走协商缓存. 对一条 http get 报文的基本缓存处理过程包括 7 个步骤: 接收, 解析, 查询, 新鲜度检测, 创建响应, 发送, 日志.
Push Cache 是指 HTTP2 在 server push 阶段存在的缓存, 是缓存的最后一道防线. 浏览器只有在 Memory Cache,HTTP Cache 和 Service Worker Cache 均未命中的情况下才会去询问 Push Cache.Push Cache 是一种存在于会话阶段的缓存, 当 session 终止时, 缓存也随之释放. 不同的页面只要共享了同一个 HTTP2 连接, 那么它们就可以共享同一个 Push Cache.
来源: http://www.jianshu.com/p/d2647336690c