避免网络载荷过大

网络载荷过大与加载用时过长密切相关。它们还会给用户带来经济损失;例如,用户可能需要支付更多蜂窝流量费用。因此,减少网页网络请求的总大小对用户在您网站上的体验和其钱包都很有益。

Lighthouse 网络载荷审核失败的原因

Lighthouse 会显示您的网页请求的所有资源的总大小(以千字节 (KiB) 为单位)。最大的请求会列在最前面:

Lighthouse“避免巨大的网络载荷”审核的屏幕截图

根据 HTTP Archive 数据,网络载荷的中位数介于 1,700 到 1,900 KiB 之间。为了帮助显示最高的载荷,Lighthouse 会标记网络请求总数超过 5,000 KiB 的页面。

如何缩减载荷大小

力求将总字节大小保持在 1,600 KiB 以下。 此目标值基于理论上可通过 3G 连接下载的数据量,同时仍能实现 10 秒或更短的互动所需时间

以下是一些可用于缩减载荷大小的方法:

特定于堆栈的指导

Angular

采用路径级代码拆分,以尽量压缩 JavaScript 软件包的大小。您也可考虑使用 Angular Service Worker 预缓存资源。

Drupal

不妨考虑使用自适应图片样式来减小网页上加载的图片的大小。如果您使用 Views 在网页上显示多个内容项,请考虑实现分页,以限制给定网页上显示的内容项的数量。

Joomla

您可以考虑在文章类别中显示摘录(使用“阅读更多”链接是一种常用的解决方案)、减少给定页面上显示的文章数量、将长帖子拆分成多个页面,或者使用插件延迟加载评论。

WordPress

建议您在博文列表中显示摘录(您可以使用“更多”标签)、减少给定页面上显示的博文的数量、将长博文拆分成多个页面,或者使用插件延迟加载评论。

资源

避免巨大网络载荷审核的源代码