使用谷歌字体时是否可以通过谷歌页面速度?我发现这种代码和平(https://github.com/typekit/webfontloader)也是谷歌推荐的。但即使我加载这个脚本,我也无法通过谷歌页面速度。
问问题
436 次
2 回答
1
WebfontLoader 与显示交换不兼容。不确定这是不是一个好的解决方案。
请务必使用来自 Google Font 的最后一个 URL 和 display=swap
<!--old code-->
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<!--new code-->
<link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet">
Google 字体的另一个问题是它使用了 2 个域。https://fonts.googleapis.com和https://fonts.gstatic.com/
您应该在标头中使用 dns prefetch 和 preconnect :
<link rel="dns-prefetch" href="//fonts.googleapis.com">
和
<link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
也许,最好的解决方案是在您的服务器中下载字体。
这是一篇关于优化 PageSpeed 字体的法语文章: Optimiser les fonts pour accélérer son site
于 2020-02-14T16:56:43.773 回答
0
令人震惊的事实是,如果您将字体本地化而不是从 Google 提供字体,您会在 PSI 中做得更好。
这听起来很疯狂,但我们尝试了 5 种不同的实现并本地化字体,而不是使用谷歌 URL 得分
于 2020-04-05T20:34:19.143 回答