网页开发(网站注册)

虽然我们生活在一个宽带无处不在，4/5G几乎全覆盖的时代，但是网站加载慢还是很正常的。即使我们打开一个以文字为中心的新闻网站，开始阅读也可能至少需要30秒。毕竟在内容膨胀的时代，一张照片的大小很容易超过1MB。许多网站会单独加载至少10MB的JS和自定义字体，以便显示几段文字。

在这方面，热衷于优化和极简主义的高级Web开发人员Nathaniel告诉我们，你应该尽可能地将你的网页保持在14KB以内，即使是以富媒体为中心的网站，这个14KB的规则可能仍然值得遵循。如果最终布局14KB不够，需要优先考虑“首屏”字节。您可以使用发送给访问者的第一个14KB数据来呈现一些有用的内容，并减少用户在开始阅读之前丢失数据的机会。

网页越小，加载速度越快——这一点也不奇怪。

但令人惊讶的是，14KB网页的加载速度比15KB快得多——可能快612毫秒——而15KB和16KB网页的差别微乎其微。

这是TCP慢启动算法造成的。本文将介绍这种算法，它的原理和为什么你应该注意它。但首先我们需要快速浏览一些基础知识。

TCP 是什么

传输控制协议(TCP)是一种使用IP协议(有时称为TCP/IP)可靠发送数据包的方法。

当浏览器向您的网站(或图片或样式表)发出请求时，它将使用HTTP请求。HTTP是基于TCP的，一个HTTP请求通常由很多TCP包组成。IP只是一个在互联网上从一个地方向另一个地方发送数据包的系统。IP无法检查数据包是否已成功到达目的地。

对于网站来说，保证所有数据到达请求端是非常重要的，否则我们可能会因为数据包丢失而无法获得完整的网页。但在网络的其他应用场景中，这并不那么重要——比如流媒体视频直播。

TCP是IP的扩展，通过它浏览器和web服务器互相告知哪些数据包已经成功到达。

服务器发送一些包，然后等待浏览器接收包的响应(这称为确认或ACK)，然后它继续发送更多的包——或者如果它没有接收到ACK，它将再次发送相同的包。

什么是 TCP 慢启动

TCP慢速启动是服务器用来确定一次可以发送多少个数据包的算法。

当浏览器第一次连接到服务器时，服务器无法知道它们之间的带宽是多少。带宽是指单位时间内网络可以传输的数据量。通常以比特每秒(b/s)为单位。我们可以用管道做类比——把带宽想象成每秒钟有多少水从管道中流出。

服务器不知道网络连接可以处理多少数据——所以它首先发送少量的安全数据——通常是10个TCP包。如果这些数据包成功到达网站访问者，他们的计算机将返回一个确认(ACK)，表明数据包已被接收。然后，服务器发送了更多的数据包，但这次它将数据包的数量增加了一倍。

这个过程将一直重复，直到数据包丢失并且服务器没有收到ACK。(此时，服务器将继续发送数据包，但速度较慢)。

这就是TCP慢启动的关键点——现实中，虽然算法不同，但这是它的基本原理。

那么 14KB 这个数字是怎么来的

大多数Web服务器的TCP慢启动算法是从发送10个TCP包开始的。

TCP数据包的最大长度是1500字节。这个最大值不是由TCP规范设定的，而是来自以太网标准。

每个TCP数据包的报头占用40个字节，其中16个字节用于IP，另外24个字节用于TCP。

这在每个TCP包中留下了1460字节。10 x 1460 = 14600字节，约14KB！

所以，如果能把网站的网页——或者说网页的关键部分——压缩到14KB，就能为访问者节省很多时间——他们和网站服务器之间的往返时间。

数据往返能有多差？但是人们非常不耐烦——一次数据往返可能出奇地长，这取决于延迟...延迟是指数据包从源传输到目的地所需的时间。如果带宽是每秒钟能通过管道的水量，那么延迟就是一滴水进入管道后从另一端流出所需要的时间。

这里有一个延迟有多糟糕的例子。

卫星网络

这个网络是由绕地球运行的卫星提供的。人们可以在人口稀少的地区、石油钻井平台、游轮和飞机上使用这个网络。

为了说明这种糟糕的延迟，让我们想象一群在石油钻塔上工作的兄弟把骰子忘在家里了。他们需要在missingdice.com玩龙与地下城(不到14KB)。

首先，其中一人用手机发送网页请求...

将手机请求发送到钻井平台的WiFi路由器，路由器将数据发送到平台上的卫星天线。我们假设这可能需要1毫秒。

然后，卫星天线将数据发送到地球轨道上方的卫星。

通常，这是通过运行在地球表面上方35，786公里的轨道卫星来实现的。光速是299792458m/s，所以信息从地球发送到卫星需要120ms。然后，卫星将信息发回地面接收站，又需要120毫秒。

然后，地面站必须将请求发送到位于地球上任何地方的服务器(当光通过光缆传输时，速度会下降到每秒200，000，000米)。如果地面站到服务器的距离等于纽约到伦敦的距离，大约需要28毫秒，如果地面站到服务器的距离等于纽约到悉尼的距离，需要80毫秒——那么我们就设定一个60毫秒的数字吧(这个数字很容易计算)。

然后，服务器需要处理请求，这可能需要10毫秒，然后服务器再次发出请求。

回到地面站，输入Tai 空，回到卫星天线，再回到无线路由器，再到手机。

手机-& gt；WiFi路由器->:卫星天线->:卫星->:地面站->:服务器->；地面站->:卫星->:卫星天线->: WiFi路由器->:手机

如果我们算一下，就是10+(1+120+120+60) x 2 = 612。

这是每次往返额外的612ms也许看起来时间并不长，但你的网站可能需要多次往返才能获得第一个资源。

此外，在完成第一次往返之前，HTTPS需要两次额外的往返——这使得延迟为1836毫秒！

对于生活在陆地上的人，延迟又是怎样的

卫星似乎是一个极端的例子——我选择它作为例子，是因为它可以充分说明网络延迟的问题——但对于生活在陆地上的人来说，延迟可能比这更糟糕，原因有很多。

2G 网络的延迟通常在 300 毫秒到 1000 毫秒之间；3G 网络的延迟可以在 100 毫秒到 500 毫秒之间；嘈杂的移动网络——比如在一个异常拥挤的地方，比如音乐节；处理大流量的服务器；其他一些不好的东西。

不稳定的网络连接也可能导致数据包丢失——导致再次往返以获取丢失的数据包。

知道了14KB规则，接下来可以做什么？

当然，你应该保持你的网页尽可能小-你爱你的访问者，你希望他们快乐。最好将每个页面的大小控制在14KB以内。

这14KB可以是压缩数据——因此它实际上可以对应于大约50KB的未压缩数据——这已经非常大了。要知道，阿波罗11号的制导计算机只有72KB的内存。

去掉自动播放的视频、弹出窗口、cookie、cookie横幅、社交网络按钮、跟踪脚本、JavaScript和CSS框架，以及所有其他人们不喜欢的垃圾——你或许就能实现14KB规则。

假设你已经尽了最大努力把所有东西都控制在14KB以内，但还是不行——但14KB规则还是有用的。

您可以使用发送给访问者的前14KB数据来呈现一些有用的东西——例如一些关键的CSS、JS和解释如何使用您的应用程序的前几段文字。

需要注意的是，14KB的规则包含HTTP头——这些头是未压缩的(甚至是HTTP/2的第一个响应),还包含图片，所以你应该只加载页面顶部的内容，并将它们保持在最低限度，或者使用占位符让访问者知道他们在等待更好的东西。

关于这个法则的一些注意事项

14KB规则更像是一种经验，而不是计算的基本规则。

一些服务器已经将 TCP 慢启动初始窗口从 10 个数据包增加到 30 个；有时服务器知道它可以从更大数量的数据包开始传输，因为它使用 TLS 握手来建立一个更大的窗口；服务器可以缓存路由可管理的数据包数量，并在下一次连接时发送更多的数据包；还有其他需要注意的地方——这里有一篇文章更深入地探讨关于为什么 14KB 法则并不总是这么回事（https://www.tunetheweb.com/blog/critical-resources-and-the-first-14kb/）。

HTTP/2 和 14KB 法则

有一种观点认为，当使用HTTP/2时，14KB规则不再适用。关于这个问题我看了所有能看的资料，但是没有看到任何证据表明使用HTTP/2的服务器已经停止使用TCP启动缓慢(10包起)。

HTTP/3 和 QUIC

与HTTP/2类似，有观点认为HTTP/3和QUIC会废除14KB规则——事实并非如此。事实上，QUIC仍然建议使用14KB规则。

原始链接:

https://end times . dev/why-your-website-should-under-14kb/