推遲上面的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完美！ :)

塊優化的CSS呈現'高於摺疊'（ATF）基本上意味着所有的「摺疊之上」樣式在'head'和'style'標籤之前'內聯'（Do not甚至在.css文件中保留一個ATF類或ID）！並將所有內容填充到外部CSS文件中並將其轉儲到頁腳，或者使用JavaScript或任何其他您喜歡的方法推遲它，Google Pagespeed Insight將很樂意忽略它！ :)如果你甚至在css文件中留下了一個課程或ID，那麼GPS會通過不停地喊'Render Blocking CSS'來使你的完美得分生活變得悲慘！即使你做任何事情都要推遲！

忘記了一切你學到的關於不內聯任何CSS並將其全部放入外部文件！ :)

乾杯！