从输入URL到页面加载的过程?由一道题完善自己的前端知识体系!
2024-10-16 12:29:05
- 强缓存与弱缓存
缓存可以简单的划分成两种类型: 强缓存( 200fromcache)与 协商缓存( 304)。
区别简述如下:
- 强缓存( 200fromcache)时,浏览器如果判断本地缓存未过期,就直接使用,无需发起http请求。
协商缓存( 304)时,浏览器会向服务端发起http请求,然后服务端告诉浏览器文件未改变,让浏览器使用本地缓存。 - 对于协商缓存,使用 Ctrl+F5强制刷新可以使得缓存无效。但是对于强缓存,在未过期时,必须更新资源路径才能发起新的请求(更改了路径相当于是另一个资源了,这也是前端工程化中常用到的技巧)。
- 上述提到了强缓存和协商缓存,那它们是怎么区分的呢?答案是通过不同的http头部控制。
先看下这几个头部:
If
None
Match
/
E
- tag
、
If - Modified
- Since
/
Last - Modified
、
Cache - Control
/
Max - Age
、
Pragma
/
Expires
这些就是缓存中常用到的头部,这里不展开。仅列举下大致使用。
属于强缓存控制的:
(
http1
.
1
)
Cache
- Control
/
Max - Age
(
http1
.
0
)
Pragma
/
Expires
注意: Max-Age不是一个头部,它是 Cache-Control头部的值。
属于协商缓存控制的:
(
http1
.
1
)
If
- None
- Match
/
E - tag
(
http1
.
0
)
If - Modified
- Since
/
Last - Modified
可以看到,上述有提到 http1.1和 http1.0,这些不同的头部是属于不同http时期的。
再提一点,其实HTML页面中也有一个meta标签可以控制缓存方案- Pragma。
不过,这种方案还是比较少用到,因为支持情况不佳,譬如缓存代理服务器肯定不支持,所以不推荐。
最新文章
- ZooKeerper学习之Watcher
- 你可能不知道的7个CSS单位
- hdu 2896 AC自动机
- [LintCode] Valid Parentheses 验证括号
- EasyUI——实现展示后台数据代码
- jQ的一些常识
- C#设计模式之十三代理模式(Proxy)【结构型】
- hadoop2.7.3+spark2.1.0+scala2.12.1环境搭建(4)SPARK 安装
- vue中路由按需加载的几种方式
- requirejs的使用和快速理解
- Maven解决NoPluginFoundForPrefixException错误
- shell 中的单行注释和多行注释
- 2018-6-20-随笔-SQL Server中乱码
- MySQL--3约束和修改数据表总结
- POJ 2373 Dividing the Path(DP + 单调队列)
- 来自官方的一些dbt 最佳实践
- 菜鸟vimer成长记——第2.1章、normal模式
- pip3
- Java MySQL(SqlHelper)
- Linux 安装Redis<;准备>;(使用Mac远程访问)