关于html缓存设置

关于html缓存设置,第1张

通过HTTP的META设置expires和cache-control 指令不区分大小写,并且具有可选参数,可以用令牌或者带引号的字符串语法。多个指令以逗号分隔。 客户端可以在HTTP请求中使用的标准 Cache-Control 指令。 Cache-Control: max-stale[=<seconds>] Cache-Control: min-fresh=<seconds> Cache-control: no-cache Cache-control: no-store Cache-control: no-transform Cache-control: only-if-cached 服务器可以在响应中使用的标准 Cache-Control 指令。 Cache-control: no-cache Cache-control: no-store Cache-control: no-transform Cache-control: public Cache-control: private Cache-control: proxy-revalidate Cache-Control: max-age=<seconds> Cache-control: s-maxage=<seconds> 拓展缓存指令不是HTTP缓存标准的一部分,使用前请注意检查 兼容性 ! Cache-control: immutable Cache-control: stale-while-revalidate=<seconds> Cache-control: stale-if-error=<seconds> public 表明响应可以被任何对象(包括:发送请求的客户端,代理服务器,等等)缓存。 private 表明响应只能被单个用户缓存,不能作为共享缓存(即代理服务器不能缓存它)。 no-cache 强制所有缓存了该响应的缓存用户,在使用已存储的缓存数据前,发送带验证器的请求到原始服务器 only-if-cached 表明如果缓存存在,只使用缓存,无论原始服务器数据是否有更新 max-age=<seconds> 设置缓存存储的最大周期,超过这个时间缓存被认为过期(单位秒)。与Expires相反,时间是相对于请求的时间。 s-maxage=<seconds> 覆盖max-age 或者 Expires 头,但是仅适用于共享缓存(比如各个代理),并且私有缓存中它被忽略。 max-stale[=<seconds>] 表明客户端愿意接收一个已经过期的资源。 可选的设置一个时间(单位秒),表示响 应不能超过的过时时间。 min-fresh=<seconds> 表示客户端希望在指定的时间内获取最新的响应。 must-revalidate 缓存必须在使用之前验证旧资源的状态,并且不可使用过期资源。 proxy-revalidate 与must-revalidate作用相同,但它仅适用于共享缓存(例如代理),并被私有缓存忽略。 immutable 表示响应正文不会随时间而改变。资源(如果未过期)在服务器上不发生改变,因此客户端不应发送重新验证请求头(例如If-None-Match或If-Modified-Since)来检查更新,即使用户显式地刷新页面。在Firefox中,immutable只能被用在 https:// transactions. 发送如下指令可以关闭缓存。此外,可以参考Expires 和 Pragma 标题。 对于应用程序中不会改变的文件,你通常可以在发送响应头前添加积极缓存。这包括例如由应用程序提供的静态文件,例如图像,CSS文件和JavaScript文件。另请参阅Expires标题。 缓存主要两个策略 强制缓存 ,协商缓存 强制缓存就是设置本地资源html img js等等缓存多长时间 超过时间就去服务器端取。 协商缓存就是每次都询问服务器资源是否已经过期 没有过期就使用缓存 已经过期就从服务器上重新取。 缓存流程可以分三个阶段 本地缓存,协商缓存 ,缓存失败 现在的vue项目里都不是这样缓存的 我个人感觉这是在静态页面时的缓存办法 现在都是webpack打包时通过 hash chunkhash contenthash来决定缓存方式 主要就是在请求的文件名称后面加一个id 来判断文件是否已经更新。

html首次加载刷新一次才更新成最新页面

这个ajax请求,几秒钟的延迟时间正常范围,它步运行的,对页面的不会造成直接影响。从图片中可看出,它的加载时间为138ms,不算长啊,后面的4.84s是它等待服务器返回数据的时间,在这段时间里,页面的其他元素是继续加载的,不会受影响。所以这个4.84s是不算在首页加载时间内的。就好比一个体育赛事直播的网页,它的比分一般都是通过ajax异步方式定时刷新的,而这个刷新的时间并不算在页面的加载时间内,因为这时候页面早就加载完毕了。

当然,这个4.84s的时间长短,是由多种因素造成的,比如电脑性能、网络状态等,但最大的影响因素通常都是后台数据库的查询速度,通过优化可以大大缩短这个查询时间。

如何优化网站性能,提高页面加载速度

c42abe5799143f7e118b6903c5d210f1.png

提升页面加载速度

1、图片大小越小打开速度越快

2、网页中代码不要臃肿所以不要有无用代码

3、js css使用外部引入

4、如果js css 不是显示用户看到的信息 而是一些特效的话放在最后加载。

怎样提高页面加载速度,论优化页面的过程

a82ba7b0082a37426238a85f636a6646.png

1、精简:去掉html页面不必要的空格释,尽量将script和css写在外部文件

可以借用第三具对页面进行加

2、减少文件数量减少页面上引用的文件数量可以减少HTTP连接数许多JavaScript、CSS文件可以合并最好合并,人家财帮子都把自己的JavaScript.functions和Prototype.js合并到一个base.js文件里去了

3、减少外部域名文件的引用

4、优化页面元素加载顺序例如:首先加载页面最初显示的内容和与之相关的JavaScript和CSS,不需要的图片文件放到后面加载,或者引用延迟加载的js

5、减少页面中inline和JavaScript的数量

6、不要在table标签中嵌套table标签,不过现在基本上都用div+css了,HTML5也出来了。

7、检查页面是否有js错误,或者空引用(检查页面有没有502错误),有没有


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6146052.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-16
下一篇 2023-03-16

发表评论

登录后才能评论

评论列表(0条)

保存