大茂名网

 找回密码
 用户注册

QQ登录

只需一步,快速开始

查看: 232|回复: 0

[【编导】] 盘点HTTP 新增的 103 状态码,这次终于派上用场了!2022/12/26 14:02:35

[复制链接]

2万

主题

2万

帖子

9万

积分

钻石元老

Rank: 24Rank: 24Rank: 24Rank: 24Rank: 24Rank: 24

积分
98065
发表于 2022-12-26 14:02 | 显示全部楼层 |阅读模式

马上注册登陆,结交更多好友,享用更多功能,让你轻松玩转社区

您需要 登录 才可以下载或查看,没有账号?用户注册

x

说到HTTP的103状态码,你可能很早就听说过了,但是你不一定真的理解了它。今天我们就来看一下,HTTP103状态码究竟有什么用途。子域名查询的相关问题可以到网站了解下,我们是业内领域专业的平台,您如果有需要可以咨询,相信可以帮到您,值得您的信赖!


大家好,我是CL。

说到HTTP?的103状态码,你可能很早就听说过了,但是你不一定真的理解了它。

这很正常,这个状态码早在2022年就被提出来了,但是支持它的服务器和浏览器真的很少。

直到前几天,C?宣布在C103?版本对HTTP103状态码提供了支持,不得不说老外还挺皮啊



今天我们就来看一下,HTTP103状态码究竟有什么用途。

资源加载的性能问题随着时间的推移,变得越来越复杂。一些大型的服务器可能需要执行很多重要的工作(例如,访问数据库或访问源服务器的CDN?)来为请求的页面生成HTML。



但是,这种服务器的思考时间?会在浏览器开始渲染页面之前带来额外的延迟。因为浏览器需要先把HTML?页面加载回来,才能知道下一步去加载哪些JS、CSS或字体文件等。中间这段时间际上就浪费掉了,对用户访问我们的页面来讲,这段等待时间就是白屏或是不可用的状态。



我们来看看抖音W?站的资源加载:浏览器先要等待前面两个HTML?的大约800?的时间才能去加载后面的JS、CSS等资源文件。

有没有办法在等待HTML响应的同时就去提前把重要的静态资源文件也加载回来呢

HTTP103状态码HTTP103?状态码(EH?)是一个信息性HTTP?状态代码,可以用于在比较终响应之前发送一个初步的HTTP响应。

利用HTTP103?状态码,就可以让服务器在服务器处理主资源的同时向浏览器发送一些关键子资源(JS、CSS或字体文件)或页面可能使用的其他来源的提示。

浏览器可以使用这些提示来预热连接,并在等待主资源响应的同时请求子资源。换句话说,EH?可以通过提前做一些工作来帮助浏览器利用这种服务器思考时间,从而提升页面的渲染性能。



在某些情况下,这可以帮助LCP?(比较大内容绘制)至少提升几百毫秒。例如在S?和C?所观察到的来看,LCP大概提升了1秒。



启用EH前后对比

什么样的适合EH在开始使用之前,可能要先思考下,什么样的比较适合这个化。

如果你的的主页面响应非常,可能没什么必要。比如对于大部分SPA(单页应用),可能用处不是那么大。



在SPA?中,大部分的逻辑都在客户端,HTML?很小,下发HTML?的服务器也基本就是没有什么逻辑的静态服务器。大部分情况下只会包括一个R?节点,以及一些资源的L?,大部分逻辑和加载时间其都在打包后的JS?中。这种情况我们只需要使用常规的=、=等手段就可以了。

但是在SSR?项目中,加载HTML?往往需要在服务端花费更多的时间,因为服务端可能和数据库交互以及将数据拼接成HTML?元素。相比之下,加载其他的脚本和样式资源可能花费的时间要更短一点,这种站点启用EH是比较合适的。



启用EH在C103?版本,对HTTP103?状态码(EH)提供了支持。

启用EH?的首步就是要确认我们站点的主页面?,也就是用户通常在访问我们的时开始的页面。如果我们有很多来自其他的用户,主页面可能就是主页或热门的产品列表页面。



EH的用途会随着用户在我们的站内导航的次数而降低,因为浏览器可能已经在前几次导航中把所有需要的子资源请求回来了,给用户良好的首印象是比较重要的!

确认了站点的主页面?,下一步就是确定哪些来源或子资源将是比较佳预连接或预加载的候选者。通常情况家,我们要找的就是对关键用户指标(LCP?或FP?)贡献比较大的源和子资源。具体一点,就是找到阻塞渲染的子资源,例如同步JS、样式表,甚至络字体等。

然后就是尽量避免选择已经过时或者不再被主页面使用的资源。

比如一些经常更新或者带有?的资源(1),尽量不要选择,这可能会导致页面需要加载的资源和际预加载的资源不匹配。

比如我们举个例子:

首先我们去服务器请求主页面:

GETH:U-A:[]C103000[]服务器预测站点将需要1?,并建议通过EH预加载它:

103EHL:1;=;=[]随后,客户端马上向服务端请求了1?。然而,这时JS?资源更新了,主页面已经需要另外一个版本的JS了。

200OK[]HTMLC'B=""="2"所以,我们比较好选择一些比较稳定的资源进行预加载,我们可以对JS进行拆包,将不经常发生变化的稳定部分和经常发生更新的动态脚本部分拆成多个资源。我们只对稳定部分施预加载,在浏览器获取到主页面后再去加载动态部分。

HTML秘密花园=""=""=""="1"比较后,在服务器端,查找已知支持EH?的浏览器发送的主页面请求,并响应103EH?。在103?响应中,会包括相关的预连接和预加载提示。主页面准备好后,再按照正常的响应进行响应。为了向后兼容,比较好在比较终响应中包含LINKHTTP标头,甚至也可以增加在生成主页面时需要的一些明显的关键资源。

EH响应:

GETH:U-A:[]C103000[]103EHL:;=L:;=;=L:;=;=成功响应:

200OKC-L:7531C-T:;=UTF-8C-:L:;=L:;=;=L:;=;=L:33290;=;=HTML秘密花园=""=""=""="1"=""=""=""和HTTP2P有什么关系看到这里你可能发现了,这玩意和HTTP2?的服务器推送(SP)很像啊。



SP?即在浏览响应HTML文件的时候,服务器会同时将所需的资源文件主动推送给浏览器。

浏览器在收到推送的资源之后会缓存到本地。等解析HTML发现需要加载对应资源的时候会直接从本地读取,不必再等待络传输了。

虽然这听起来很神奇,但这个方案有非常大的缺陷:SP?很难避免推送浏览器已经拥有的子资源,其很多资源在浏览器首次请求到就已经缓存下来了。这种“过度推动”会导致络带宽的使用效率降低,从而显着阻碍性能势。总体而言,C?数据显示HTTP2P际上对整个络的性能产生了负面影响。

所以,C?宣布移除了对HTTP2SP特性的支持:



相比之下,EH?在践中表现更好,因为它结合了发送初步响应的能力和提示,浏览器际上只负责获取它际需要的资源。虽然EH?还没有涵盖HTTP2SP?理论上可以解决的所有用例,但是它解决了络带宽浪费的问题,可以说是HTTP2SP的升级版。

支持情况浏览器支持情况:



服务器支持情况:

N?:通过F插件提供支持;A?:通过_2支持;H2O:支持;N:验模块。
爱上大茂名,喜当大猫友,吃喝玩乐事,天天乐开怀!
您需要登录后才可以回帖 登录 | 用户注册

本版积分规则

QQ|客服:0668-2886677QQ:75281068|大茂微博|小黑屋|手机版|Archiver|大茂名网 ( 粤ICP备18149867号 )茂名市大茂科技有限公司 版权所有 

GMT+8, 2025-6-7 17:28 , Processed in 0.127013 second(s), 8 queries , Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表