无法摆脱谷歌的pagespeed洞察警告（该网站有阻止css）

当检查我的网站在谷歌的网页速度的见解，它给了我警觉，该网站有阻止CSS：Google pagespeed insights。这是我的代码：无法摆脱谷歌的pagespeed洞察警告（该网站有阻止css）

<head> 
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> 
</head>

我试图把它移动到身体，</body>前的权利，但它并没有帮助，甚至减少了点。可以做些什么来解决这个问题？谢谢。

Turbolinks和PageSpeed混合不好。
从turbolinks
请注意，Turbolinks只会考虑跟踪资产<head>而不是页面上的其他位置。

从Google's Web Fundamentals
默认情况下，CSS被视为渲染阻塞资源。

Rails默认会伤害PageSpeed。有些人把“关键”CSS内联在<head>之内，并且在</body>之前链接到其余的链接。但正如所述，turbolinks不会跟踪<head>以外的资产。

一个解决方案，我已经看到了
application.html.erb

<style> 
    <%= raw File.read("public" + asset_path("application.css")) %> 
</style>

这使所有的CSS内联。可能不是最好的解决方案，但它确实提高了PageSpeed。我见过用JS做的那些网站。

2017-09-08 02:29:50

回答