Mengatasi Render Blocking CSS Font Awesome

Cara Mengatasi / Memperbaiki Render Blocking CSS Font Awesome

Akhirnya saya menemukan cara mengatasi / memperbaiki render blocking CSS Font Awesome di blog dari Kompiajaib. Cara asynchronus CSS ini menggunakan kode JavaScript, untuk Tutorialnya, langsung saja :

Silahkan gunakan script di bawah ini dan simpan di atas kode </body>

<script>
//<![CDATA[
function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || "all" }) }
loadCSS("https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css");
//]]>
</script>

Silahkan sesuaikan kode yang saya marking di atas dengan link Font Awesome dengan versi yang anda gunakan. Link Font Awesome di atas merupakan link Font Awesome versi terbaru untuk saat ini (4.4.0).

Sekarang silahkan cek blog Anda di PageSpeed Insights. Apakah render-blocking dari link css Font Awesome di blog Anda sudah teratasi?

Sumur : http://www.kompiajaib.com/2014/12/mengatasi-render-blocking-css-font.html