Mengatasi Render blocking Javascript

Render Blocking Javascript

Script Defer & Async.

Menambahkan defer atau Async pada link.

Contoh

<script src='https://cdn.ampproject.org/v0.js' rel='stylesheet'/>

Tambahkan async='async', menjadi :

<script async='async' src='https://cdn.ampproject.org/v0.js' rel='stylesheet'/>

Paste script langsung ke dalam tag body

Caranya:
1. Uji halaman di Page Speed Insight tool
2. Cari bagian : ■ Kurangi JavaScript yang tidak digunakan
↙ ^{Link script}
3. Sorot dengan kursor tepat seperti tanda panah hingga muncul detail link,
   lalu klik kanan, pilih salin alamat link
4. Jika sudah, buka tab baru dibrowser. Kemudian pastekan ke kolom address bar, tekan Enter / OK.
   
   Address bar browser

   https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js
5. Jika sudah terbuka, klik di halamannya dan tekan ctrl + a atau copy seluruh teks yang ada dihalaman tersebut lalu pastekan diatas tag </body>
6. Pastikan peletakannya didalam tag script seperti ini :
   
   <script type='text/javascript'>
   /* Letakkan teks yang dicopy dari halalaman tersebut disini. */
   </script>
   

Block Script dengan javascript

Untuk memblokir script yang tidak terpakai, bisa juga menggunakan script seperti ini.
Copy - paste script berikut :

<script> 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"})} /*Ganti url didalam kurung dengan script yang ingin diblokir*/ loadCSS("https://URLjavascript1.js"); loadCSS("https://URLjavascript2.js"); loadCSS("https://URLjavascript3.js"); </script>

Paste script tersebut tepat diatas tag </body>.
Untuk memastikan fungsinya, uji halaman di Pagespeed Insight.