网页中F5刷新与ctrl + F5强制刷新的区别?

简介: 网页中F5刷新与ctrl + F5强制刷新的区别?

1667913099087.jpg

F5-刷新


只是刷新一次当前页面的资源,使用F5刷新,浏览器仍然会重复利用之前的缓存数据。


ctrl + F5  -强制刷新


使用ctrl+F5进行刷新,这个时候浏览器就不会重复利用之前已经缓存的数据了,而是去清空缓存,把所有的资源进行重新下载,使网页与本机储存的网页时间标记相同。


这一点在我们进行抓包分析的时候经常会用到,可能有些时候有些没有东西没有抓到,那么就要考虑一下是不是我们刷新的姿势没对?


这两个的区别很大!


一个网页,不仅仅只是有一个HTML,还会依赖其他很多的资源,比如:CSS、JS、图片等。


这些资源都是网络下载到浏览器本地的。由于这些资源可能很大,又限制于网络传输的速率,这个时候去加载页面的速度可能就不会很快,那么进一步就会影响到用户的使用感。


那么这个时候,浏览器就会把这些依赖的资源直接缓存到本地,后续访问的时候速度就很快了, 因为是已经缓存了,就不需要去下载了。


下面通过一个例子,也许能对浏览器缓存机制有一点点理解:


打开哔站,然后观察网络状态,我们先使用F5刷新:

1667913156293.jpg

我们可以看到使用F5刷新,这些加载的静态的文件大小都来源于浏览器的内存缓存。下面我们再使用ctrl + F5 刷新:

1667913171159.jpg

我们可以看到,此时加载的这些文件大小都来自于网络下载,而且显示了多大的文件。其实我们通过加载时间,也可以理解为什么浏览器会有缓存机制,使用F5刷新的时候,加载时间在1秒左右,但是使用ctrl + F5的时候,加载时间在3秒左右,这就能够理解浏览器为什么就会把这些依赖的资源直接缓存到本地,后续访问的时候速度就会很快。


总结:


F5刷新只是请求本地资源重新加载。那么在这个时候,如果在某些业务场景的服务器资源发生了改变,那么这边的本地用户可能某些功能或产品访问不到。


ctrl + F5 是直接请求服务器的资源,让当前页面的资源重新全部从服务器上下载下来,这样就全部更新了。


相关文章
element整理<el-calendar>日历组件-假期(整理)
element整理<el-calendar>日历组件-假期(整理)
|
前端开发 JavaScript 应用服务中间件
前端跨域问题解决Access to XMLHttpRequest at xxx from has been blocked by CORS policy
跨域问题是前端开发中常见且棘手的问题,但通过理解CORS的工作原理并应用合适的解决方案,如服务器设置CORS头、使用JSONP、代理服务器、Nginx配置和浏览器插件,可以有效地解决这些问题。选择合适的方法可以确保应用的安全性和稳定性,并提升用户体验。
9908 90
|
6月前
|
人工智能 芯片
万相2.7,模型使用指南
万相2.7,拥有全面的创作控制力,将AI的能力从单一素材生成扩至创作全链路,从“演”迈向“导” 。
万相2.7,模型使用指南
|
12月前
|
SQL Java 数据库连接
除了JDBC,还有哪些常见的数据库访问技术?
除了JDBC,还有哪些常见的数据库访问技术?
944 2
|
移动开发 JavaScript
(H5查看CAD)网页CAD提取图纸表格到excel
本文介绍如何通过自定义MxCAD插件,在Web端智能识别CAD图纸中的表格,实现自动合并与高效导出至Excel,提升数据提取效率与准确性。内容涵盖区域选择、图形识别、表格结构重建、单元格合并及内容导出等关键技术,适用于工程图纸数据自动化处理场景。
|
前端开发 JavaScript
用iframe的方式实现微前端
微前端是最近几年火起来的概念,iframe是早期实现微前端的理想方案,而现在有了其它的方案,比如qianduan框架,single-spa,以及webpack5带来的联邦模块方案。但是每一个方案都有其优缺点,感兴趣的可以去实践一下。
|
缓存 JSON 前端开发
超详细讲解:http强缓存和协商缓存
超详细讲解:http强缓存和协商缓存
|
Java 大数据 Shell
Azkaban--使用实战--shell、command 调度 | 学习笔记
快速学习 Azkaban--使用实战--shell、command 调度
1421 0
Azkaban--使用实战--shell、command 调度 | 学习笔记
|
JSON API 数据格式
二维码操作[二维码解析基础版]免费API接口教程
此接口用于解析标准二维码内容,支持通过BASE64编码或远程图片路径提交图片。请求需包含用户ID、用户KEY、图片方式及图片地址等参数,支持POST和GET方式。返回结果包括状态码和消息内容,适用于图片元素简单的二维码解析。
980 2
|
安全
ctfshow-WEB-web4
tf.show WEB模块第4关是一个文件包含漏洞,页面提示了源码中的关键代码,使用include()函数接收url参数,include()函数包含的文件会被执行,从而造成任意代码执行,或者配合伪协议获取敏感文件甚至getshell; 然而这一关伪协议不起作用,我们可以通过日志注入进行任意命令执行,从而getshell
748 0
ctfshow-WEB-web4

热门文章

最新文章