Ditulis oleh: Ditulis pada: 12/15/2014
Sebelumnya untuk mengatasi render-blocking CSS dari Font Awesome ini saya menggunakan script yang dibagikan oleh mas +Arie Gondes di link berikut: http://gond3s.com/2014/05/asynchronous-font-awesome.html, namun ternyata script tersebut tidak berjalan di blog Kompi Ajaib.
Kemudian saya mencoba mencari cara lain untuk mengatasi loading blog akibat render-blocking css dari Font Awesome ini di Google. Akhirnya saya menemukan script asynchronous css Font Awesome yang benar-benar bisa berjalan di blog Kompi Ajaib ini.
Nah bagi Anda yang kebetulan memiliki permasalahan yang sama seperti saya tadi, yaitu script asynchronous untuk Font Awesome dari mas Arie Gondes ternyata tidak bisa jalan di blognya, silahkan mencoba script berikut yang saya gunakan.
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("//maxcdn.bootstrapcdn.com/font-awesome/4.2.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 (Desember, 2014).
Sekarang silahkan cek blog Anda di PageSpeed Insights. Apakah render-blocking dari link css Font Awesome di blog Anda sudah teratasi?
Selamat mencoba... dan happy blogging....
Script ini saya temukan dari link berikut:
Source code: http://www.gotknowhow.com/articles/how-to-asynchronously-load-font-awesome-css-file