Langsung ke konten utama

Cara Defer Async Kode CSS Blogger

Kali ini saya bagikan cara menggunakan defer atau async kode css di blogger. Karena selain dari widget css bundle yang memblokir perenderan konten paruh atas di blog. Ada kode css lain yang biasa dipanggil untuk mempercantik tampilan blog seperti dari maxcdn dan font awesome. Biasanya kode css eksternal itu ada karena menggunakan template luar selain dari template default bawaan blogger.

Dan sudah pasti kamu sering melihatnya. Pertanyaannya bagaimana kita menggunakan async atau defer kode css eksternal itu? Biasanya untuk font awesome bisa disematkan inline pada ]]></b:skin> blogger, namun apabila kode external css lainnya tidak dapat disematkan didalam Edit HTML blogger dan tetap ingin kamu defer, itu juga bagus karena akan lebih simpel dan menghemat ukuran HTML blog.

Baca juga:
~ Cara menghilangkan javascript yang memblokir rendering di konten paruh atas
~ Cara menghilangkan css yang memblokir blogger

Tujuan Defer Kode CSS

Tujuannya jelas karena ingin mempercepat loading blog agar rendering kode eksternal ditunda dulu sehingga konten utama blog dapat ditampilkan untuk pengunjung. Karena loading yang lama dapat membuat pengunjung pergi dari blog.

Cara Defer Kode CSS

Langkah 1. Copy kode script defer dibawah ini dan gantikan url link kode css yang ingin di defer.
<script type='text/javascript'>
//<![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.2.0/css/font-awesome.min.css");
//]]>
</script>
Langkah 2. Letakkan kode yang telah di copy, diatas </head> blog kamu dan Simpan.

Sangat mudah bukan? Silahkan kamu cek dengan pagespeed insight milik google apakah kode css eksternal masih memblokir render konten paruh atasnya.

Komentar

Postingan populer dari blog ini

Mod Immortal Treasure Trove Carafe 2018

Mod immortal Treasure Trove Carafe 2018. This treasure contain of : Huskar - The Spoils of Dezun, Ogre Magi - Gimlek Decanter, Pangolier - Mask of Confidant, Venomancer - Cult of Aktok, Rubick - Crux of Perplex, Disruptor - Orb of Deliverance, Silencer - Glaive of Oscilla, Storm Spirit - Mandate of the Stormborn, Windranger - Sylvan Vedette and Mirana mount - Axia of Metira. Hope you guys like this mods cosmetic skin and support our favorite game Dota 2 in steam community market. No money? Just mods! Enjoy the game and boost your Matchmaking Ratings MMR and Seasonal Rankings Medals !

Rubick - Rambling Fatebender

Mod Rubick - Rambling Fatebender rare item Dota 2 Reborn from Treasure of the Emerald Revival. This item consists of : Staff of the Rambling Fatebender Cape of the Rambling Fatebender Pauldrons of the Rambling Fatebender Mask of the Rambling Fatebender Rubick - Rambling Fatebender Hope you guys like this mod and support our favorite game in steam community market. No money? Just mods! Enjoy your game!

Broodmother - Epoch of the Abysm

Black Arachnia, the Broodmother - Epoch of the Abysm mods rare item Dota 2 Reborn from Fortivus 2017 Treasure. This item consists of : Eyes of the Abysm Abdomen of the Abysm Anterior of the Abysm Legs of the Abysm Creepling of the Abysm Broodmother - Epoch of the Abysm Hope you guys like this mods and support our favorite game in steam community market. No money? Just mods! Enjoy your game!