Ⅰ 浏览器缓存的作用是什么
为了提高访问网页的速度，Internet Explorer浏览器会采用累积式加速的方法，将你曾经访问的网页内容（包括图片以及cookie文件等）存放在电脑里。这个存放空间，我们就称它为IE缓存。以后我们每次访问网站时，IE会首先搜索这个目录，如果其中已经有访问过的内容，那IE就不必从网上下载，而直接从缓存中调出来，从而提高了访问网站的速度。 设置IE缓存大小: 要提高IE的访问速度，IE缓存是必不可少的。IE缓存默认安装在系统区，而且会需要占用较大的系统空间。所以如果你的系统空间的确很紧张，可以将缓存占用的空间设得小一点，在IE的“工具”菜单下选择“Internet选项”，然后在“常规”选项卡中你会看到有“Internet临时文件”这一项，单击“设置”按钮，然后在弹出的“设置”对话框中将缓存大小设置为一个合适的值。你也可以直接将IE缓存移动到其它位置上去。 “Internet临时文件”下单击“设置”，然后在“设置”对话框中单击“移动文件夹”按钮，在“浏览文件夹”中选择文件夹，将IE缓存移动到其他地方，这样就不必担心IE缓存太大，占用更多空间了。
Ⅱ 电脑中浏览器缓存是什么意思
浏览器缓存（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"（清空）。
某些情况下，可能需要多次清空您的缓存。
Ⅲ 浏览器缓存的方式和类型（笔记）
浏览器缓存只是计算机缓存的一种
1.内存缓存
将数据存到内存
2.代理服务器缓存
就是个自己找的中介。你拿东西先找中介，中介找房东，房东给中介，中介又给你。比如你需要房子钥匙，房东把钥匙放在中介那，你直接从中介那里拿钥匙。
3.CDN缓存
将数据存到CDN服务器。CDN也是个中介，不过这个中介是根据中介的忙碌程度（CDN服务器忙碌程度）、跟你的距离（CDN服务器和你的距离）自动给你分配的。
4.浏览器缓存（ 我是个前端，只关注浏览器缓存。 ）
根据HTTP协议决定要不要缓存，以什么方式缓存，缓存到哪（内存还是硬盘等）。
浏览器缓存是将浏览器请求过的数据（资源文件）保存到电脑上。需要再次使用的时候，直接从电脑上获取保存的数据（资源文件），这就是浏览器缓存
1.减少网络请求，节省流量
2.减轻服务器压力
3.资源加载速度快了，前端性能就更好了
1.Server Worker
还没搞懂，搞懂了再来写。
2.Memory Cache
内存中的缓存，关闭页面进程就释放内存
3.Disk Memory
硬盘中的缓存，不主动清理就一直在
4、Push Cache
推送缓存，是HTTP/2的内容，并没有严格执行HTTP头部的缓存指令。在Server Worker、Memory Cache、Disk Cache都没有命中的时候，它会被使用。在Session中存在，Session结束就会被释放，缓存时间短暂。
1.先去内存查找，找到直接加载
2.内存找不到，硬盘中找，找到直接加载
3.硬盘找不到进行网络请求
4.把请求获取的资源再缓存到硬盘和内存
1.强缓存
控制强制缓存的字段分别是Expires和Cache-Control，Cache-Control优先级比Expires高
-Expires设置一个绝对时间的GMT格式的时间字符串，这个是资源失效时间（ 客户端的时间小于Expires的值，缺陷就是客户端的时间被改变就有问题 ），在这个时间之前都直接读取缓存。
-Cache-Control替代Expires，它利用的是相对时间，利用header信息字段的max-age值判断。
2.协商缓存
-Last-Modified/If-Modified-Since
Last-Modified:浏览器向服务器发送资源最后的修改时间
If-Modified-Since:当资源过期时，发现响应头具有Last-Modified声明，则再次向服务器请求时带上头if-modified-since，表示请求时间。服务器收到请求后，发现有if-modified-since则与被请求资源的最后修改时间进行对比（Last-Modified）,若最后修改时间较新，说明资源又被改过，则返回最新资源，返回200；若最后修改时间较小，说明资源无新修改，返回304 ，使用缓存文件。
缺点:单位是秒，一秒内多次改变会认为没过期
-ETag/If-None-Match
ETag:由服务器生成返回给前端，帮助服务器控制web端的缓存验证，服务器会生成并且返回当前资源文件的一个唯一标识
If-None-Match:当资源过期时，发现响应头具有Etag声明，则再次向服务器请求时带上头if-none-match（唯一标识Etag值）。服务器收到该请求后，发现有If-None-Match则根据If-None-Match的字段值与该资源在服务器的Etag值做对比，一致则返回304，代表资源无更新，继续使用缓存文件；不一致则重新返回资源文件，状态码为200。
1.强缓存不发请求，协商缓存会发请求给服务器确认有没有过期
2.强缓存文件更新浏览器不知道，协商缓存更新浏览器能实时知道
1.点击浏览器的刷新按钮时，全部走缓存
2.F5或者鼠标右键刷新强制缓存失效，不影响协商缓存
3.CTRL+F5影响强制缓存和协商缓存都失效
Ⅳ ☆前端优化：浏览器缓存技术介绍
在前端开发中，性能一直都是被大家所重视的一点，然而判断一个网站的性能最直观的就是看网页打开的速度。 其中提高网页反应速度的一个方式就是使用缓存 。缓存技术一直一来在WEB技术体系中扮演非常重要角色，是快速且有效地提升性能的手段。
一个优秀的缓存策略可以缩短网页请求资源的距离，减少延迟，并且由于缓存文件可以重复利用，还可以减少带宽，降低网络负荷。
所以，缓存技术是无数WEB开发从业人员在工作过程中不可避免的一大问题。 在产品开发的时候我们总是想办法避免缓存产生，而在产品发布之时又在想策略管理缓存提升网页的访问速度 。了解浏览器的缓存命中原理，是开发WEB应用的基础，本文着眼于此，学习浏览器缓存的相关知识，总结缓存避免和缓存管理的方法，结合具体的场景说明缓存的相关问题。希望能对有需要的人有所帮助。
在实际WEB开发过程中，缓存技术会涉及到不同层、不同端，比如：用户层、系统层、代理层、前端、后端、服务端等， 每一层的缓存目标都是一致的，就是尽快返回请求数据、减少延迟 ，但每层使用的技术实现是各有不同，面对不同层、不同端的优劣，选用不同的技术来提升系统响应效率。所以，我们首先看下各层的缓存都有哪些技术，都缓存哪些数据，从整体上，对WEB的缓存技术进行了解，如下图所示：
本篇文章重点讲的就是上面红色框部分缓存内容。
当浏览器请求一个网站的时候，会加载各种各样的资源，比如：HTML文档、图片、CSS和JS等文件。对于一些不经常变的内容，浏览器会将他们保存在本地的文件中，下次访问相同网站的时候，直接加载这些资源，加速访问。
那么如何知晓浏览器是读取了缓存还是直接请求服务器？如下图网站来做个示例：
第一次打开该网站后，如果再次刷新页面。会发现浏览器加载的众多资源中，有一部分size有具体数值，然而还有一部分请求，比如图片、css和js等文件并没有显示文件大小，而是显示了 from dis cache 或者 from memory cache 字样。这就说明了，该资源直接从本地硬盘或者浏览器内存读取，而并没有请求服务器。
浏览器启用缓存至少有两点显而易见的好处： （1）减少页面加载时间；（2）减少服务器负载；
浏览器是否使用缓存、缓存多久，是由服务器控制的 。准确来说，当浏览器请求一个网页（或者其他资源）时， 服务器发回的响应的“响应头”部分的某些字段指明了有关缓存的关键信息 。下面看下，HTTP报文中与缓存相关的首部字段：
根据上面四种类型的首部字段不同使用策略， 浏览器中缓存可分为强缓存和协商缓存 ：
当浏览器对某个资源的请求命中了强缓存时， 返回的HTTP状态为200 ，在chrome的开发者工具的network里面 size会显示为from cache ，比如：京东的首页里就有很多静态资源配置了强缓存，用chrome打开几次，再用f12查看network，可以看到有不少请求就是从缓存中加载的：
Expires是HTTP 1.0提出的一个表示资源过期时间的header，它描述的是一个绝对时间，由服务器返回，用GMT格式的字符串表示 ，如：Expires:Thu, 31 Dec 2037 23:55:55 GMT，包含了Expires头标签的文件，就说明浏览器对于该文件缓存具有非常大的控制权。
例如，一个文件的Expires值是2020年的1月1日，那么就代表，在2020年1月1日之前，浏览器都可以直接使用该文件的本地缓存文件，而不必去服务器再次请求该文件，哪怕服务器文件发生了变化。
所以， Expires是优化中最理想的情况，因为它根本不会产生请求 ，所以后端也就无需考虑查询快慢。它的缓存原理，如下：
Expires是较老的强缓存管理header， 由于它是服务器返回的一个绝对时间 ，在服务器时间与客户端时间相差较大时，缓存管理容易出现问题， 比如：随意修改下客户端时间，就能影响缓存命中的结果 。所以在HTTP 1.1的时候，提出了一个新的header， 就是Cache-Control，这是一个相对时间，在配置缓存的时候，以秒为单位，用数值表示 ，如：Cache-Control:max-age=315360000，它的缓存原理是：
Cache-Control描述的是一个相对时间 ，在进行缓存命中的时候， 都是利用客户端时间进行判断 ，所以相比较Expires，Cache-Control的缓存管理更有效，安全一些。
这两个header可以只启用一个，也可以同时启用， 当response header中，Expires和Cache-Control同时存在时，Cache-Control优先级高于Expires ：
此外，还可以为 Cache-Control 指定 public 或 private 标记。 如果使用 private，则表示该资源仅仅属于发出请求的最终用户，这将禁止中间服务器（如代理服务器）缓存此类资源 。对于包含用户个人信息的文件（如一个包含用户名的 HTML 文档），可以设置 private，一方面由于这些缓存对其他用户来说没有任何意义，另一方面用户可能不希望相关文件储存在不受信任的服务器上。需要指出的是，private 并不会使得缓存更加安全，它同样会传给中间服务器（如果网站对于传输的安全性要求很高，应该使用传输层安全措施）。 对于 public，则允许所有服务器缓存该资源 。通常情况下，对于所有人都可以访问的资源（例如网站的 logo、图片、脚本等）， Cache-Control 默认设为 public 是合理的 。
当浏览器对某个资源的请求没有命中强缓存， 就会发一个请求到服务器，验证协商缓存是否命中，如果协商缓存命中，请求响应返回的http状态为304并且会显示一个Not Modified的字符串 ，比如你打开京东的首页，按f12打开开发者工具，再按f5刷新页面，查看network，可以看到有不少请求就是命中了协商缓存的：
查看单个请求的Response Header， 也能看到304的状态码和Not Modified的字符串，只要看到这个就可说明这个资源是命中了协商缓存，然后从客户端缓存中加载的 ，而不是服务器最新的资源：
【Last-Modified，If-Modified-Since】的控制缓存的原理，如下 ：
【Last-Modified，If-Modified-Since】都是根据服务器时间返回的header，一般来说， 在没有调整服务器时间和篡改客户端缓存的情况下，这两个header配合起来管理协商缓存是非常可靠的，但是有时候也会服务器上资源其实有变化，但是最后修改时间却没有变化的情况 ，而这种问题又很不容易被定位出来，而当这种情况出现的时候，就会影响协商缓存的可靠性。 所以就有了另外一对header来管理协商缓存，这对header就是【ETag、If-None-Match】 。它们的缓存管理的方式是：
Etag和Last-Modified非常相似，都是用来判断一个参数，从而决定是否启用缓存。 但是ETag相对于Last-Modified也有其优势，可以更加准确的判断文件内容是否被修改 ，从而在实际操作中实用程度也更高。
协商缓存跟强缓存不一样，强缓存不发请求到服务器， 所以有时候资源更新了浏览器还不知道，但是协商缓存会发请求到服务器 ，所以资源是否更新，服务器肯定知道。大部分web服务器都默认开启协商缓存，而且是同时启用【Last-Modified，If-Modified-Since】和【ETag、If-None-Match】，比如apache:
如果没有协商缓存，每个到服务器的请求，就都得返回资源内容，这样服务器的性能会极差。
【Last-Modified，If-Modified-Since】和【ETag、If-None-Match】一般都是同时启用，这是为了处理Last-Modified不可靠的情况。有一种场景需要注意：
比如，京东页面的资源请求，返回的repsonse header就只有Last-Modified，没有ETag：
协商缓存需要配合强缓存使用，上面这个截图中，除了Last-Modified这个header，还有强缓存的相关header， 因为如果不启用强缓存的话，协商缓存根本没有意义 。
如果资源已经被浏览器缓存下来，在缓存失效之前，再次请求时，默认会先检查是否命中强缓存，如果强缓存命中则直接读取缓存，如果强缓存没有命中则发请求到服务器检查是否命中协商缓存，如果协商缓存命中，则告诉浏览器还是可以从缓存读取，否则才从服务器返回最新的资源。其浏览器判断缓存的详细流程图，如下：
Ⅳ 什么是Web缓存
“web缓存,是指在用户访问网站后,在用户客户端留下的缓存。没缓存的情况下,客户端会对整站进行加载。有缓存的时候,会跳过已缓存的内容。
Ⅵ WEB缓存有什么用
减少网络带宽消耗。无论对于网站运营者或者用户，带宽都代表着金钱，过多的带宽消耗，只会便宜了网络运营商。当Web缓存副本被使用时，只会产生极小的网络流量，可以有效的降低运营成本。
降低服务器压力。给网络资源设定有效期之后，用户可以重复使用本地的缓存，减少对源服务器的请求，间接降低服务器的压力。同时，搜索引擎的爬虫机器人也能根据过期机制降低爬取的频率，也能有效降低服务器的压力。
减少网络延迟，加快页面打开速度。带宽对于个人网站运营者来说是十分重要，而对于大型的互联网公司来说，可能有时因为钱多而真的不在乎。那Web缓存还有作用吗？答案是肯定的，对于最终用户，缓存的使用能够明显加快页面打开速度，达到更好的体验。
Ⅶ 前端浏览器缓存机制
在前端开发中，性能是一个永恒的话题，没有最好，只有更好。判断一个网站性能好坏，一个直入眼观的即是网页的反应速度，有一个方式就是使用缓存，一个优秀的缓存策略可以缩短网页请求的时间，减少延迟，并且网页可以重复利用，还可以减少带宽，降低网络负荷。
1： 为什么需要缓存？
a：缓存可以减少用户等待时间，提升用户体验
b：减少网络带宽消耗
c：降低服务器压力
Note：缓存使用不当，也会造成‘脏数据’问题
2：常见的缓存类型
强缓存 -
Expires服务器端设置，表示该资源的过期时间，会有弊端，客户端时间和服务器时间不一致的问题。
Cache-Control：max-age表示缓存资源的最大生命周期，单位是秒
所以Expires 结合 Cache-Control 一起使用，大型网站中一般比较适用
协商缓存-
Last-Modified：值为资源的最后更新时间，随服务器response返回
If-Modified-Since：通过比较两个时间来判断资源在两次请求期间是否有过修改，如果没有，则命中协商缓存
Etag：表示资源内容的唯一标识，即资源的消息摘要
If-None-Match：服务器通过比较请求头中的If-None-Match与当前资源的Etag是否一致来判断资源是否在两次请求期间有过修改
3：缓存流程图示：
a：浏览器会先检测强缓存类型（Cache-Control 或者 Expires）是否有效；命中直接浏览器本地获取缓存资源
b：未命中。服务器会根据请求头Request Header验证这个资源是否命中协商缓存，称之为HTTP二次验证，命中，服务器返回请求，但返回资源，而是告诉客户端直接中直接从浏览器缓存中获取
Note：
1.强缓存不会发生请求，协商缓存存在服务器请求
2.当协商缓存也未命中时，则服务器会将资源发送到客户端
3.F5刷新页面，会跳过强缓存
4.Ctrl+F5刷新页面，跳过强缓存和协商缓存
5.不会缓存的情况
HTTPS POST请求 根据Cookie获取认证信息 Request Header Cache-Control：no-cache， max-age=0
6.小故事大道理
上文对整个概念做了阐述，还是不够形象，我们来通过几个小故事生动理解一下：
故事一：Last-Modified
浏览器：Hi，我需要 jartto.min.js 这个文件，如果是在 Last-Modified: Fri Feb 15 2019 19:57:31 GMT 之后修改过的，请发给我。
服务器：（检查文件的修改时间）
服务器：Oh，这个文件在那个时间之后没有被修改过，你已经有最新的版本了。
浏览器：太好了，那我就显示给用户了。
故事二：ETag
浏览器：Hi，我需要 jartto.css 这个文件，有没有不匹配 3c61f-1c1-2aecb436 这个串的
服务器：（检查 ETag…）
服务器：Hey，我这里的版本也是 3c61f-1c1-2aecb436，你已经是最新的版本了
浏览器：好，那就可以使用本地缓存了
Ⅷ 网站缓存功能是什么意思
提前下载后储存在本地硬盘中
缓存的最根本的目的是为了提高网站性能,减轻频繁访问数据而给数据库带来的压力.再进一步,合理的缓存了某种数据形式,还会减轻程序运算时,对CPU带来的压力.首先,我们要知道一个最基本的效率规则,操作内存中的数据比操作存放在硬盘上的数据是要快N个数量级的.操作简单的文本结构的数据比操作数据库中的数据快N个数量级.
目前缓存的做法分为两种模式:
第一种模式是内存缓存,缓存数据存放在服务器的内存空间中,这种模式的效率是最高的.这里要注意的是:每一个服务器的资源都是有限的,盲目的把所有数据都加在到内存中,将可能会导致服务器资源占用过多,而造成Web服务失败.
第二种模式就是文件缓存,缓存数据存放在服务器的硬盘空间中.存放格式有很多种类,如:文本格式,XML格式,二进制格式等等.这里要注意的是,服务器I/O的处理能力有限,当一次性读取过大数据时(>1M),它并没有想象中那么的高效.这个时候就需要你有一个合理的文件结构来解决了.但这已经不在我们本次要讲叙的内容范围内了.
Ⅸ http缓存之基本概念
1. 重要性
综上所述，所以大家很有必要花时间来研究。
2. 困难之处
个人认为http缓存是比较枯燥的理论知识，尤其对于前端来讲，更多在于理解概念，以及内部缓存机制，而没有什么实践可以巩固，或者说理论和现实脱轨。
浏览器会在请求资源之后，根据自己的缓存策略判断是否对资源进行缓存，当再次请求相同的资源时，浏览器根据缓存策略判断是通过本地缓存获取资源，还是重新向服务器发起请求。
这个 缓存策略 到底是什么呢？
实际每个浏览器的缓存策略是有差异的，但大致受以下几个因素的影响。
搜索关键字 禁止 html 缓存 ，很容易搜到以下答案：
但是，这是 Html 4.0 中的规范，在 Html 5.0 的规范中 http-equiv 已经不存在以上属性值了。
而且代理服务器并不会读取以上meta标签，不利于代理服务器的缓存。
-- 引用自 stackoverflow
综上所述， html meta 是一个不那么可靠，并且已经过时的解决方案，所以不建议再继续使用 。
基于 HTTP 协议的缓存策略，分为 强缓存 和 协商缓存 , 由 HTTP 协议的首部 (Headers) 信息决定。具体的操作设置需要服务器配合，比如 Nginx 。所以相对来说都是后端在做此类事情，前端接触的机会比较少。
如果开启了强缓存，并且在过期时间之内，则浏览器不再发起请求，直接使用本地的缓存资源。
Expires 和 Cache-control 用于控制强制缓存。
Expires 是 HTTP 1.0 的特性。通过指定一个明确的时间点作为缓存资源的过期时间，客户端会根据此时间点来判断到底使用本地缓存，还是向服务器重新请求资源。
优点： 在缓存过期时间内，减少客户端的 HTTP 请求，不仅节省了客户端处理时间，提高了 web 应用的执行速度，而且减少了服务器负载，以及客户端网络资源的消耗。
缺点：指定的过期时间以服务器为准，但是客户端进行过期时间判断时是将 本地的时间 与 指定的过期时间点 进行对比。如果客户端修改了本地时间，将会影响对缓存的判断。
Cache-control 是HTTP1.1 新增的特性，以便更精准地控制缓存。此首部信息 具有最高的优先级。
max-age 指定的是缓存的时间跨度，而非缓存失效的时间点。优先级比 Expires 高。
如果需要使用协商缓存，需要 将 Cache-control 指定为 no-cache 或者 max-age 、Expires 均过期之后。
协商缓存：浏览器本地是有缓存的，但是要先发起请求，由服务器判断缓存是否过期。
Last-Modified / If-Modified-Since
last-Modified 是 HTTP 1.0 的特性，是服务器端在响应请求时用来说明资源的最后修改时间。
缺点：
Etag / If-None-Match
Etag 是 HTTP 1.1 的特性，是服务器为资源分配的字符串形式唯一性标识，作为响应首部返回给浏览器。
采用弱比较，内容没变化，时间变化了，会认为是资源未变化。
浏览器之HTTP缓存的那些事
304和浏览器http缓存
浏览器缓存机制剖析
浏览器缓存机制介绍
技术研究 vue项目的性能优化之路
HTTP缓存控制小结