延迟折叠的CSS渲染器突然无法通过Google Pagespeed Insight Test

Question

有人可以告诉我为什么以下工作的渲染延迟脚本突然无法通过Google Pagespeed Insight Test吗？

<script>
function loadCSS(href){
var ss = window.document.createElement('link'),
ref = window.document.getElementsByTagName('head')[0];
ss.rel = 'stylesheet';
ss.href = href;
// temporarily, set media to something non-matching to ensure it'll
// fetch without blocking render
ss.media = 'only x';
ref.parentNode.insertBefore(ss, ref);
setTimeout( function(){
// set media back to `all` so that the stylesheet applies once it loads
ss.media = 'all';
},0);
}
loadCSS('link.css');
</script>

<noscript>
<!-- Let's not assume anything -->
 <link rel="preload" href="link.css" as="style" onload="this.rel='stylesheet'">

</noscript> 

该页面是http://www.landshoppe.com/

我在用

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" data-pagespeed-orig-type="text/javascript" async></script>

在页脚

Answer 1

终于我找到了答案。 这个答案对于那些在如何正确获取Google pagespeed得分方面有些头绪的人很有用！

我想我快要破解了。 我在台式机上有98，在移动版上有94。 即将争取完美100！ :)

对阻止渲染“折叠后”（ATF）的CSS的优化基本上意味着将所有“折叠前”样式都“内联”在“ head”标签和“ style”标签内（甚至不要留下一个ATF类或.css文件中的ID）！ 并将其他所有内容填充到外部css文件中，然后将其转储到页脚中，或者使用javascript或您喜欢的任何其他方法将其推迟，Google Pagespeed Insight会很乐意忽略它！ :)如果您在css文件中甚至只留下一个类或ID，GPS都会不知疲倦地大喊“ Render Blocking CSS”，从而使您的完美人生简直是惨不忍睹！ 即使您竭尽所能延后了！

忘记关于不内联任何CSS并将其全部放入外部文件的所有知识！ :)

干杯！