我目前正在使用我的 <head>
中包含的 Google 字体通过 Rails application.scss 标记,如下所示:
`@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700');`
Google PageSpeed 说我需要“消除首屏内容中阻止呈现的 JavaScript 和 CSS”当我将字体 CSS 移动到页面底部时,每当页面加载时整个页面都会跳转。
我怎样才能使 Google 字体成为非阻塞的,但页面在完成加载时不会跳转?
最佳答案
您可以阅读一篇关于这个问题的好文章 here
问题是您将无法摆脱那个跳跃问题(除非自定义字体与被替换的字体具有完全相同的属性)。
And there you have it. If you load the page for the very first time you will see the fallback font immediately, followed by the web font once it loads. Subsequent visits will load the web fonts from cache and show them immediately. It’s the best of both worlds.
是的,长话短说,您可以实现性能,也可以避免 FOUC,但不能两者兼而有之。
关于javascript - 如何消除作为字体的阻塞 CSS?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41787068/