Mengatasi Remove Render-Blocking JavaScript untuk Loading Blog
June 5, 2015
Cara Remove Render-Blocking JavaScript dan Optimize CSS Delivery untuk Mempercepat Loading Blog.
Google juga ngasih tau Cara Mengatasi Render-Blocking JavaScript itu sebagai berikut:
Ubah kode JavaScriptnya dari yang semula:
<script type="text/javascript" src="kode.js"></script>
MENJADI begini:
<script type="text/javascript" src="kode.js"></script>
MENJADI begini:
/* Isi File JavaScript di Sini */
</script>
atau begini:
<script type='text/javascript'>
//<![CDATA[
/* Isi File JavaScript di Sini */
//]]>
</script>
.blue {color: blue;}
<style>
.blue{color:blue;}
</style>
atau begini:
<script type='text/javascript'>
//<![CDATA[
/* Isi File JavaScript di Sini */
//]]>
</script>
Contohnya, dari semula begini:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js></script>
Diubah menjadi:
<script type="text/javascript">
/*! jQuery v1.8.3 jquery.com | jquery.org/license */
(function(e,t){function _(e) ... dan seterusnya dst... hingga (window);
</script>
Cara mengetahui isi kodenya: copas link http://........... min.js di address bar, akan muncul deretan kode js nan panjang bingits.
Penting!!!
Jika terjadi error atau muncul notifikasi error, silakan atasi dengan Memasang JavaScript yang Benar.
Penting!!!
Jika terjadi error atau muncul notifikasi error, silakan atasi dengan Memasang JavaScript yang Benar.
Optimize CSS Delivery
Se,ain itu, saran Google lainnya di Page Speed adalah Optimize CSS Delivery, yaitu mengubah kode CSS agar blog lebih fast loading. Caranya, masih dari Google, adalah sebagai berikut:
Conrohnya, kode CSS yang tadinya seperti ini:
<link rel="stylesheet" href="http://..... small.css">
Isi small css-nya dibuka dulu (copas link http://..... small.css di address bar) dan akan muncul, misalnya, kode seperti ini:
Diubah Menjadi begini:
.blue{color:blue;}
</style>
Tutorial Mengatasi Remove Render-Blocking JavaScript dan Optimize CSS Delivery ini CB posting sekadar menyimpan salah satu dokumentasi tips mempercepat loading blog, biar gak buka Panduan Google terus jika butuh.
Banyak template yang dimodif, di antaranya dengan cara di atas, sehingga loading time-nya lebih baik alias lebih fast loading. (http://www.contohblog.com).*
Previous
« Prev Post
« Prev Post
Next
Next Post »
Next Post »
Ini yang sebelumnya membuat saya bingung ketika melakukan test di PageSpeed Insights. Terima kasih CB, akan saya coba.
ReplyDeleteYW :) Good Luck......!
DeleteThis comment has been removed by the author.
ReplyDeleteMas deddy ini kenapa ya? Mungkin tanda petik pada & itu maksudnya &.. Coba ganti tulisan & ini dengan kode seperti ini: &
DeleteDan (&) + amp + titik atas dan bawah titik koma.
Terimakasih atas informasinya mas...
ReplyDeletegan saya masih bingung itu yang ahrsu di betulinnya yang mananya...?
ReplyDeleteapa yang terjadi jika javascriptnya malah kita hapus ??
ReplyDeletekarena solusi dari google insightsnya malah nyuruh hapus
gak yang nyuruah hapus. remove = pindahkan, bukan hapus (delete)
Deleteerror "&" in om...knp ya
ReplyDeletetambah amp; menjadi & atau tambahkan kode // dan di atas //]]> < /script >
Delete< script type= ' text/javascript ' >
//
< / script >
Error yg ane alamin di bagian ini gan: module&&
Deleteamp; ditaruh sebelah mananya?
Silakan atasi: http://www.contohblog.com/2016/04/cara-memasang-javascript-yang-benar.html
Deletecara menempatkannya dimn mas?
ReplyDeleteposisi kode tidak berubah
Deletegak ngerti saya
ReplyDeleteKalo misal pake wordpress di bagian mana yg harus di edit gan ?
ReplyDeletegan,error ketika di edit "The content of elements must consist of well-formed character data or markup."
ReplyDeleteSilakan simak: http://www.contohblog.com/2016/04/cara-memasang-javascript-yang-benar.html
Deletebuka jasa ga om,,? saya ga bisa melakukannya,, blog sya berat bnget
ReplyDeleteUntuk wordpress ada tidak min?
ReplyDeletemanteo pak berhasil
ReplyDeleteberhasil..its work
ReplyDeleteterima kasih artikelnya langsung sy praktekkan
ReplyDelete