跳至主要內容

浏览器缓存

chanchaw大约 2 分钟javascript

静态资源

对于浏览器来说,静态资源是指那些在服务器上存储且内容不会因用户请求而改变的文件。常见的静态资源包括:

  1. HTML文件:网页的基本结构。
  2. CSS文件:用于定义网页的样式和布局。
  3. JavaScript文件:用于实现网页的交互功能。
  4. 图片:如JPEG、PNG、GIF、SVG等格式的图像文件。
  5. 字体文件:如WOFF、WOFF2、TTF等格式的字体。
  6. 视频和音频文件:如MP4、WebM、MP3等格式的多媒体文件。
  7. PDF文件:用于展示或下载的文档。
  8. JSON文件:用于存储和传输数据。

这些资源在服务器上存储,浏览器请求时直接返回,内容不会因用户不同而变化。

多种类型的加载

分类

正常的重新加载1/3

地址栏回车、页面链接跳转、打开新窗口/标签页、history前进后退,点击刷新按钮、页面右键重新加载、F5、ctrl+R 都属于正常的重新加载,执行上面这些刷新操作,如果缓存不过期,会使用缓存

硬性重新加载2/3

点击硬性重新加载、Ctrl+F5、Ctrl+Shift+R 都属于硬性重新加载,执行这些刷新操作,清除了关键位置的缓存;所有的资源,都会跳过缓存判断,发起真实的请求,从服务端拿资源。但本地的缓存资源(如disk里的缓存)并没有删除。 这种方式会在Request Header里添加Cache-Control:no-cache和Pragma: no-cache,也是浏览器自己的行为

清空缓存并硬性重新加载3/3

点击左上角的清空缓存并硬性重新加载,这种方式,相当于先删除缓存(如 disk磁盘 和 memory内存 里的缓存),再执行硬性重新加载。

缓存路径

在浏览器地址栏中输入 chrome://version/ 显示如下图

通过下面方法查看页面加载的各个资源都来自哪个缓存