Mengatasi Render-Blocking Javascript - Mempercepat Loading Blog

Cara Mengatasi Render-Blocking Javascript - Javascript Memblokir Render untuk Mempercepat Loading Blog.

PESAN error Render-Blocking Javascript atau Javascript Memblokir Render biasa kita temukan saat ngetes kecepatan blog di Page-Speed Insight Google.

Render-Blocking Javascript atau Javascript Memblokir Render itu artinya butuh waktu untuk mengambil kode JS sehingga mempengaruhi tampilan blog.

Menurut panduan Google, kita harus menghapus Render-Blocking Javascript itu agar tampilan blog lebih kenceng (fast loading).

2 Cara Mengatasi Render-Blocking Javascript

Sudah banyak blogger yang berbagi tips mengatasinya. Namun, intinya ada dua cara, sebagaimana bisa dicek di SERP Google tentang Mengatasi Render-Blocking Javascript ini.

1. Menambahkan kode asynchronous

Tambahkan kode asyinc='async'

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'/>

MENJADI

<script async='async' src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'/>

Namun, asynchronous pada jquery library ini tidak baik karena akan mengganggu element blog yang menggunakan jquery.

Jika ada element yang tidak berfungsi, coba pindahkan kode JS tersebut tepat di atas kode </body> yang ada di bagian bawah kode-kode template blog.

2. Memasukkan link ke dalam kode script

<script type='text/javascript'>

//<![CDATA[ var cb=function(){var e=document.createElement('script');e.src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'; var t=document.getElementsByTagName('body')[0]; t.parentNode.insertBefore(e,t)},raf=requestAnimationFrame||mozRequestAnimationFrame||webkitRequestAnimationFrame||msRequestAnimationFrame;raf?raf(cb):window.addEventListener('load',cb); //]]>

</script>

Namun, sama seperti kode asyncon, memindahkan link JS kedalam kode tersebut juga tidak ada jaminan berhasi. Coba saja, semoga sukses.