理解延迟

延迟是指一数据包从源头传输到目的地所需的时间。在性能优化方面,优化以减少延迟的原因非常重要,并且要通过模拟高延迟来测试网站性能,以优化连接质量较差的用户体验。本文将解释什么是延迟,它如何影响性能,如何测量延迟以及如何减少延迟。

什么是延迟?

延迟通常是指用户发出请求到响应返回给用户所需的时间。在首次请求时,对于最初的 14KB 字节,延迟会更长,因为它包括 DNS 查询、TCP 握手和安全的 TLS 协商。后续请求的延迟会更短,因为与服务器的连接已经建立。

延迟描述了网络或互联网连接上的延迟量。低延迟意味着几乎没有延迟。高延迟意味着有很多延迟。提高性能的主要目标之一就是减少延迟。

单个资源的延迟,尤其是基本 HTML 页面的延迟,可能看起来微不足道。但网站通常涉及多个请求:HTML 包含对多个 CSS、脚本和媒体文件的请求。这些请求的数量和大小越大,高延迟对用户体验的影响就越大。

在低延迟连接上,请求的资源几乎会立即出现。在高延迟连接上,发送请求到资源返回之间会有明显的延迟。我们可以通过测量数据从一个网络位置移动到另一个网络位置的速度来确定延迟量。

延迟可以通过一种方式测量,例如,发送资源请求所需的时间,或者从浏览器请求资源到请求的资源到达浏览器时的整个往返时长。

网络节流

要模拟低带宽网络的延迟,您可以使用开发者工具并切换到较低端的网络连接。

Emulate latency by emulating throttling

在开发者工具的“网络”表中,您可以将“节流”选项切换到 2G、3G 等。不同的浏览器开发者工具有不同的预设选项,模拟的特征包括下载速度、上传速度和最小延迟(或发送数据包所需的最小时间)。一些预设的近似值包括:

Selection 下载速度 上传速度 最小延迟 (毫秒)
GPRS 50 kbps 20 kbps 500
普通 2G 250 kbps 50 kbps 300
良好的 2G 450 kbps 150 kbps 150
普通 3G 750 kbps 250 kbps 100
良好的 3G 1.5 Mbps 750 kbps 40
普通 4G/LTE 4 Mbps 3 Mbps 20
DSL 2 Mbps 1 Mbps 5
Wi-Fi 30 Mbps 15 Mbps 2

网络时序

此外,在“网络”选项卡中,您可以看到每个请求完成所需的时间。我们可以查看一个 267.5KB 的 SVG 图片资源花了多长时间下载。

The time it took for a large SVG asset to load.

当一个请求在队列中等待网络连接时,它被认为是阻塞的。当通过 HTTP 对单个服务器发出过多的并发连接时,就会发生阻塞。如果所有连接都已在使用中,浏览器就无法下载更多资源,直到连接被释放,这意味着这些请求和资源被阻塞了。

DNS 解析是指进行 DNS 查询所花费的时间。 主机名越多,需要进行的 DNS 查询就越多。

连接是指完成 TCP 握手所需的时间。与 DNS 类似,所需的服务器连接越多,花费在创建服务器连接上的时间就越多。

TLS 握手是指建立安全连接所需的时间。虽然 TLS 握手比不安全的连接需要更长的连接时间,但安全连接所需的额外时间是值得的。

发送是指将 HTTP 请求发送到服务器所需的时间。

等待是磁盘延迟,服务器完成响应所需的时间。磁盘延迟曾经是性能关注的主要领域。然而,随着计算机内存或 CPU 的改进,服务器性能也得到了提高。根据服务器所需功能的复杂性,这仍然可能是一个问题。

接收是指下载资源所需的时间。接收时间取决于网络容量和资源文件大小的组合。如果图片已经被缓存,这将几乎是瞬时的。如果我们进行了节流,接收时间可能长达 43 秒!

测量延迟

网络延迟是指从发出请求的计算机到响应的计算机之间的数据请求所需的时间。包括一个数据字节从响应计算机返回到请求计算机所需的时间。通常测量为往返延迟。

磁盘延迟是指计算机(通常是服务器)收到请求到计算机返回响应之间所需的时间。