如今速度就是一切。浏览器将尝试缓存网页上的内容以更快地加载它们。有很多方法可以告诉浏览器要缓存什么、什么时候缓存以及将缓存的内容保留多长时间。预加载是一种缓存功能,有助于提高 WordPress 网站的页面加载速度。但是,这可能会在 Google PageSpeed Insights 工具中使用的 Google Lighthouse 报告中产生错误。在本文中,让我们解释一下如何修复 PageSpeed Insights 中由于字体导致的预加载键请求问题。

如何使用preload?

顾名思义,预加载告诉浏览器在页面开始加载时就开始缓存网页上的资源。这将有助于缓存稍后需要的 CSS、脚本和字体。您可以在这篇 Google Developers 文章中了解有关预加载的更多信息。

基本上,预加载就是HTML链接标签中rel属性的值。以下是在您的站点上使用预加载请求的语法:

对于每个 CSS、脚本和字体文件,您需要在 HTML 的 head 标签之间插入此链接标签。

Google PageSpeed 预加载问题

虽然预加载可以加快加载时间,但应该正确使用它。使用 PageSpeed Insights 工具检查您的网站,查看是否因预加载请求而提供任何机会。下面是一个示例,显示由于预加载密钥请求,您可以节省 7.05 秒。

当您单击向下箭头时,您将看到导致延迟的所有相关内容。在这种情况下,所有字体都加载到网页上。

PageSpeed Insights 中预加载密钥请求错误