我正在尝试通过 Google 页面速度洞察,但我无法通过“消除首屏内容中阻止呈现的 JavaScript 和 CSS”来实现,因为正在加载 Google 字体。 Google Insights 的所有建议似乎都不适用于这种情况:内联 css、使用媒体查询等。我什至尝试使用 WebFontLoader 异步加载网络字体。但它仍然被 Insights 捕获。
我想应该有一个非常简单的修复而不用做愚蠢的事情,例如设置加载字体的超时时间(用于记录类型的作品 ;-))。
更新
用 Webpack 打包网络字体显然也可行,但我不确定这是“正确”的解决方案。
最佳答案
我解决此“渲染阻止”通知的方法是使用 javascript/jquery 加载 google 字体 url。
你设置的例子:
$('head').append("<link href='https://fonts.googleapis.com/css?family=Raleway:300' rel='stylesheet' type='text/css'>);
将其加载为 .js 文件
<script src="your.js" async></script>
关于javascript - 为 Google Insights 加载谷歌字体的非阻塞方式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39347694/