<link rel="preload" in header.php但 Google PageSpeedinsight 仍然显示缓慢的移动预加载密钥请求



我正在努力解决移动设备中wordpress网站的速度问题。移动速度为43,而桌面速度为93我认为主要的问题来自预加载密钥请求时间。这个问题来自于字体真棒中使用的Elementor插件字体。虽然我已经在header.php文件<link rel="preload"中为使用的字体设置了预加载键请求,但我发现它仍然会导致移动设备的速度变慢,谷歌页面速度洞察对此进行了检查。此外,我在谷歌开发工具控制台中看到错误显示:

"字体是使用链接预加载预加载的,但在窗口加载事件后的几秒钟内没有使用。请确保它具有适当的as值,并且是有意预加载的。">

我还使用了wprocket插件来缓存网站。尽管我清除了缓存并停用了缓存,但我仍然看到它显示了移动设备的字体问题。

我没有找到任何方法来解决移动字体问题。

有人能给我任何建议来解决移动和桌面的所有字体速度问题吗?

有一个快速修复方法。只需从Google Page Speed Insights获取需要预加载的url。

然后下载插件:插入页眉和页脚。

在标题中的脚本中-只需添加以下行:

<link rel="preload" href="https://url-to-font-location" as="font" type="font/woff2" crossorigin="anonymous">

假设资源是一个字体-如果不是,则相应地进行调整。这比更新php主题文件更干净。

预加载错误

"字体是使用链接预加载预加载的,但没有在几个内使用从窗口的加载事件开始的秒。请确保它有适当的值,并且它是有意预加载的">

这意味着您正确地预加载了一些页面上不需要的内容。

如果你在网站的每一页上都看到同样的错误,那么你正在加载一种不需要的字体。

我不确定elementor是否在WordPress管理中有删除字体的设置,如果没有,你将不得不深入研究代码并手动禁用它。

请记住,如果您这样做,可能会导致elementor出现问题。

尽管我清除了缓存并停用了缓存,但我仍然看到它显示了移动设备的字体问题

很可能你在汉堡菜单上使用了一个字体图标,这可以解释为什么你在手机上出现错误,而在桌面上没有。

有人能给我任何建议来解决移动和桌面的所有字体速度问题吗

是的,不要使用字体真棒。相反,学习如何使用内联SVG——一旦你理解了它们,通常只是一个复制粘贴作业来替换图标。以下是一些关于内联SVG与字体作为图标的信息,让您开始学习。

最新更新