Google 字体在页面速度上受到惩罚

Question

我在我的网站上使用 Google 字体中的字体，并且我正在通过 css:

导入

@import url('https://fonts.googleapis.com/css?family=Montserrat:100,300,300i,400,400i,600,600i,700,800,900');

问题是 Google PageSpeed Insights 通知了以下信息：

确保加载 webfont 时文本仍然可见

使用 CSS 字体查看功能确保用户可以在加载网络字体时查看文本。

通知下方列出了我正在导入的所有字体规格：

有人遇到过这个问题吗？

你知道怎么调整吗？

我在使用 Google 字体的多个网站上收到此通知。

Answer 1

在@font-face

下使用font-display: swap;或font-display: fallback;

Google 前 URL for with font-display: swap;:

https://fonts.googleapis.com/css?family=Montserrat:100,300,300i,400,400i,600,600i,700,800,900&display=swap

Google 前 URL for with font-display: fallback;:

https://fonts.googleapis.com/css?family=Montserrat:100,300,300i,400,400i,600,600i,700,800,900&display=fallback

Being penalized on Page Speed by Google Fonts