Ⅰ 什么是浏览器缓存
什么是浏览器缓存
浏览器缓存(BrowerCaching)是浏览器在本地磁盘对用户最近请求过的文档进行存储,当访问者再次访问同一页面时,浏览器就可以直接从本地磁盘加载文档。
浏览器缓存的优点有:
减少了冗余的数据传输,节省了网费
减少了服务器的负担,大大提升了网站的性能
加快了客户端加载网页的速度
在前端开发面试中,浏览器缓存是web性能优化面试题中很重要的一个知识点,从而说明浏览器缓存是提升web性能的一大利器,但是浏览器缓存如果使用不当,也会产生很多问题,正所谓是,想说爱你,并不是很容易的事。所以,结合最近遇到的案例,本文对浏览器缓存相关的悉兄知识进行总结归纳,希望对读者睁逗袭有所帮助。
浏览器缓存的分类
浏览器缓存主要有两类:缓存协商和彻底缓存,也有称之为协商缓存和强缓存。
浏览器在第一次请求发生后,再次请求时:
浏览器会先获取该资源缓存的header信息,根据其中的expires和cahe-control判断是否命中强缓存,若命中则直接从缓存中获取资源,包括缓存的header信息,本次请求不会与服务器进行通信;
如果没有命中强缓存,浏览器会发送请求到服务器,该请求会携带第一次请求返回的有关缓存的header字段信息(Last-Modified/IF-Modified-Since、Etag/IF-None-Match),由服务器根据请求中的相关header信息来对比结果是否命中协商缓存,若命中,则服务器返回新的响应header信息更新缓存中的对应header信息,但是并不返回资源内容,它会告知浏览器可以直接从缓存获取;否则返回最新的资源内容
强缓存
强缓存是利用http的返回头中的Expires或者Cache-Control两个字段来控制的,用来表示资源的缓存时间。
Expires
该字段是http1.0时的规范,它的值为一个绝对时间的GMT格式的时间字符串,比如Expires:Mon,18Oct206623:59:59GMT。这个时间代表着这个资源的失效时间,在此时间之前,北京电脑培训建议指伏即命中缓存。这种方式有一个明显的缺点,由于失效时间是一个绝对时间,所以当服务器与客户端时间偏差较大时,就会导致缓存混乱。
Ⅱ 关于浏览器缓存
首先浏览器缓存分为 内存缓存 和 文件缓存 。
内存缓存是浏览器自己控制的,不受 Cache-Control 影响,跟计算机内存空间大小有关,并且关闭浏览器就会消失。
文件缓存 就是我们常说的浏览器缓存。
文件缓存分为2种: 强制缓存 和 协商缓存 。
强制缓存 就是通过Header上配置Cache-Control:public,max-age=300这种形式实现的,Cache-Control可以客户端在请求Header配置,也可以服务端在响应Header配置。
强制缓存 比较适合用在变化频率比较低的文件上,比如图片,js,css都可以,通常我们都使用这种缓存再配合文件hash后缀实现缓存文件的即时更新。
协商缓存 是一种服务端控制文件缓存的策略,机制是服务端会根据最新更改时间和文件标识判断响应的时候是否要返回内容。虽然每次都会向服务端发起请求,但是如果服务端确定缓存,会返回很少响应内容。
这种方式比较适合需要频繁更新的文件,需要配合Cache-Control:no-cache阻止强制缓存。另外html不要配置强制缓存,通常我们请求的html文件地址不会加hash。
协商缓存 主要通过2组Header标签让客户端与服务端确认来达成:首先服务端在响应的时候会加上 Last-Modified 和 Etag ,前者表示文件最后更新时间,后者表示文件唯一标识;然后客户端再次请求的时候会带上 If-Modified-Since 和 If-None-Match ,值分别跟服务端的 Last-Modified 和 Etag 一致。
参考:
浏览器缓存
Ⅲ 浏览器缓存机制简单概括和分析
对于访问的页面和请求,为了缩短网页请求资源的距离,减少延迟,并且由于缓存文件可以重复利用,还可以减少带宽,降低网络负荷,浏览器和服务器都有可能会对请求资源进行缓存,接下来的文章就简单介绍和分析浏览器的缓存机制。
深入理解浏览器的缓存机制: https://www.jianshu.com/p/54cc04190252
这篇文章已经有详细的讲解,这里就概括一下:
以首页的请求为例:
1、强制缓存策略(Expires和Cache-Control) :当浏览器发起http请求的时候,如果配置了缓存策略且缓存在有效期内,会直接使用浏览器缓存。 不使用强制缓存 ( Cache-Control=no-chache, 或者 max-age=0 )
(1)、图中请求服务器:是 max-age=0 的情况,浏览器直接请求服务器资源,而不是用本地缓存
(2)、图中磁盘缓存和内存缓存:就是浏览器使用了本地缓存而不再请求服务器资源
2、协商缓存策略(Last-Modified和If-Modified-Since, ETag和If-None-Match): 当浏览器发起http请求的时候,如果 强制缓存策略 失效,或者者禁用了强制缓存,这时候会根据 If-Modified-Since 中的值与服务器中这个资源的最后修改时间对比,如果没有变化,返回304和空的响应体,直接从缓存读取,如果If-Modified-Since的时间小于服务器中这个资源的最后修改时间,说明文件有更新,于是返回新的资源文件和200。
不使用协商缓存 ( Cache-Control=no-store ),这个参数同时也会 禁用强制缓存。
(1)、服务器资源返回无更新,浏览器使用上次请求的资源
(2)、服务器资源有更新,返回200并返回最新的资源
3、不使用缓存策略(Cache-Control=no-store): 所有内容都不会被缓存,即不使用强制缓存,也不使用协商缓存。当response head 设置了no-store,浏览器不会对返回的资源做缓存,每次请求都是直接请求服务器。这可以保证浏览器每次都能拿最新的资源,即使资源对比上次请求没有任何更新,但同时也降低了页面的响应速度,和增加了网络的IO与服务器的压力。
可以明显的看到请求时间,请求服务器资源时间 >> 请求磁盘缓存 > 请求内存缓存,所以合适的缓存策略,可以在不影响业务的情况下,极大地提升客户体验和后台服务器压力。
Ⅳ 电脑中浏览器缓存是什么意思
浏览器缓存(Browser Caching)是为了加速浏览,浏览器在用户磁盘上对最近请求过的文档进行存储,当访问者再次请求这个页面时,浏览器就可以从本地磁盘显示文档,这样就可以加速页面的阅览。缓存的方式节约了网络的资源,提高了网络的效率。
浏览器缓存清楚记录了你在电脑上上网记录,有时漏隐私之举。
如何清除上网留下的浏览器缓存:
1、自动清理IE缓存的方法:打开IE,选择“工具--internet选项”,切换到“高级”选项卡,找到“关闭浏览器时清空internet临时文件夹”,并将其选中,确定即可.
2、要清空 Mozilla Firefox 的缓存,请按以下步骤操作:
注销您的 AdSense 帐户。关闭所有其他打开的浏览器窗口。
单击浏览器顶部的"Tools"(工具)菜单,并选择"Options"(选项)。
单击"Privacy"(隐私)。
单击"Cache"(高速缓冲)旁边的"Clear"(清空缓存)。
单击"OK"(确定)。
3、要清空 Mozilla 和 Netscape 的缓存,请按以下步骤操作:
注销您的 AdSense 帐户。关闭所有其他打开的浏览器窗口。
单击浏览器顶部的"Edit"(编辑)菜单,然后选择"Preferences"(首选项)。
单击"Advanced"(高级)旁边的"+"。
单击"Advanced"(高级)下面的"Cache"(高速缓存)。
单击"Clear Cache"(清除高速缓存)。
单击"OK"(确定)。
4、要清空 Safari 的缓存,请按以下步骤操作:
注销您的 AdSense 帐户。关闭所有其他打开的浏览器窗口。
打开浏览器工具栏中的"Safari"菜单。
选择"Empty Cache"(清空缓存)。
单击该对话框中的"Empty"(清空)。
某些情况下,可能需要多次清空您的缓存。
Ⅳ 浏览器缓存原理简述
缓存文件存储方式有2种:内存和硬盘。为了提高文件读取速度,浏览器优先读内存中的缓存文件(如果存在的话)。
按照本地缓存阶段和协商缓存阶段分类:
缓存的策略由http消息头Cache-Control确定,以下为各个值对应的效果:
Cache-Control:public :所有内容都将被缓存(客户端和代理服务器都可缓存)
Cache-Control:private :所有内容只有客户端可以缓存
Cache-Control:no-cache :默认值。客户端缓存内容,但是是否使用缓存则需要经过协商缓存来验证决定
Cache-Control:no-store :所有内容都不会被缓存,即不使用强制缓存,也不使用协商缓存
Cache-Control:max-age=xxx (xxx is numeric) :缓存内容将在xxx秒后失效
HTTP1.0 的特性,标识该资源过期的时间点,它是一个绝对值,格林威治时间(Greenwich Mean Time, GMT),即在这个时间点之后,缓存的资源过期; 优先级:Cache-Control 优先级高于 Expires ,为了兼容,通常两个头部同时设置;浏览器默认行为:其实就算 Response Header 中没有设置 Cache-Control 和 Expires,浏览器仍然会缓存某些资源,这是浏览器的默认行为,是为了提升性能进行的优化,每个浏览器的行为可能不一致,有些浏览器甚至没有这样的优化。
Last-Modified (Response Header)与 If-Modified-Since (Request Header)是一对报文头,属于 http 1.0。
If-Modified-Since 是一个请求首部字段,并且只能用在 GET 或者 HEAD 请求中。Last-Modified 是一个响应首部字段,包含服务器认定的资源作出修改的日期及时间。当带着 If-Modified-Since 头访问服务器请求资源时,服务器会检查 Last-Modified,如果 Last-Modified 的时间早于或等于 If-Modified-Since 则会返回一个不带主体的 304 响应,否则将重新返回资源。
ETag 与 If-None-Match 是一对报文头,属于 http 1.1。
ETag 是一个响应首部字段,它是根据实体内容生成的一段 hash 字符串,标识资源的状态,由服务端产生。If-None-Match 是一个条件式的请求首部。如果请求资源时在请求首部加上这个字段,值为之前服务器端返回的资源上的 ETag,则当且仅当服务器上没有任何资源的 ETag 属性值与这个首部中列出的时候,服务器才会返回带有所请求资源实体的 200 响应,否则服务器会返回不带实体的 304 响应。
Ⅵ 浏览器缓存的作用是什么
作用是:
【释放内存,可以快速响应手机操作】
【负面就是当你浏览曾经浏览过的页面时,如果不清除缓存,会比较快,但是一清除的话就如同你的额手机第一次浏览该网页,所有的链接、图片、媒体、声音脚本都得重新下载,显得比较慢,也增加了数据流量(理论上讲本地有的话系统是不会再从网上down资料的,这样就增加了你的数据流量)】
Ⅶ 电脑中浏览器缓存是什么意思
浏览器缓存,是打开网页首先需要加载到本地的图片文字视频等网页文件,一般只有缓存到本地才可以流畅访问,否则就会无法正常加载。或者就无法打开网页了。