外星人源码论坛 首页 编程经验 由memoryCache和diskCache产生的浏览器缓存机制的思考

由memoryCache和diskCache产生的浏览器缓存机制的思考

2018-3-5 06:31
原作者: 外星人源码网 来自: 外星人源码网 收藏 分享 邀请

今天在做项目的优化的时候,使用chrome开发者工具的network发现了细节:虽然这两个看起来都是从缓存中读取,但还是有一些不一样的! webkit资源的分类 webkit的资源分类主要分为两大类:主资源和派生资源 http状态码 ...

今天在做项目的优化的时候,使用chrome开发者工具的network发现了细节:

虽然这两个看起来都是从缓存中读取,但还是有一些不一样的!

webkit资源的分类

webkit的资源分类主要分为两大类:主资源和派生资源

http状态码

200 from memory cache

不访问服务器,直接读缓存,从内存中读取缓存。此时的数据时缓存到内存中的,当kill进程后,也就是浏览器关闭以后,数据将不存在。

但是这种方式只能缓存派生资源。

200 from disk cache

不访问服务器,直接读缓存,从磁盘中读取缓存,当kill进程时,数据还是存在。

这种方式也只能缓存派生资源

304 Not Modified

访问服务器,发现数据没有
更新,服务器返回此状态码。然后从缓存中读取数据。

但是这里有困惑,怎么判断from memory cache还是304

三级缓存原理

    先去内存看,如果有,直接加载 如果内存没有,择取硬盘获取,如果有直接加载 如果硬盘也没有,那么就进行网络请求 加载到的资源缓存到硬盘和内存

所以我们可以来解释这个现象

图片为例:

访问-> 200 -> 退出浏览器
再进来-> 200(from disk cache) -> 刷新 -> 200(from memory cache)

http header

max-age

web中的文件被用户访问(请求)后的存活时间,是个相对的值,相对Request_time(请求时间)

Expires

Expires指定的时间根据服务器配置可能有两种:

    文件最后访问时间 文件绝对修改时间

如果max-age和Expires同时存在,则被Cache-Control的max-age覆盖

last-modified

WEB 服务器认为对象的最后修改时间,比如文件的最后修改时间,动态页面的最后产生时间

ETag

对象(比如URL)的标志值,就一个对象而言,文件被修改,Etag也会修改

Cache-Control

简单理解,强缓存

最后结论

见图片(来源自网络)


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

粉丝 阅读33 回复0
上一篇:
React专利许可证研究发布时间:2018-03-05
下一篇:
laravel分页样式替换(增加首页尾页)发布时间:2018-03-05
推荐资讯
阅读排行
国内最专业的源码技术交流社区
全国免费热线电话

0373-5171417

周一至周日9:00-23:00

反馈建议

admin@eenot.com 在线QQ咨询

扫描二维码关注我们