Cara Defer parsing JavaScript: Kecepatan Loading

Cara Defer parsing JavaScript Tingkatkan Kecepatan Loading – Dalam rangka untuk memuat halaman secara sempurna, browser akan menjalankan kerjanya mengurai HTML dan isi semua website termasuk gambar, CSS dan konten lain. Termasuk penguraian seluruh script/Javascript yang terdapat dalam halaman itu sendiri, pada proses ini membutuhkan waktu tambahan dan merupakan beban halaman saat browser sedang memuat-nya.

Dengan melakukan Defer parsing JavaScript atau meminimalkan jumlah JavaScript yang diperlukan untuk membuka halaman secara sempurna. Menunda pemuatan javascript akan memberikan dampak baik bagi SEO website atau blog, ini karena pemuatan halaman akan lebih cepat!. Artinya, mesin pencari lebih mudah menemukan halaman kita dan pengguna lebih cepat mengaksesnya, terutama pengguna dengan perangkat mobile.

Cara Defer parsing JavaScript

Menurut pemahaman saya pribadi tentang “DEFER” adalah menunda, dan cara defer parsing JavaScript bermaksud menunda penguraian JavaScript yang tidak terlalu penting  fungsinya dijalankan setelah laman paruh atas website/blog kita terbuka secara sempurna.





Cara ini diterapkan agar dapat mengurangi waktu awal memuat atau membuka halaman web/blog milik kita. Untuk lebih jelas tentang PageSpeed Insights defer parsing Javascript bisa di baca pada panduan google “hapus javasrirpt yang memblokir perenderan“.

Masalah Javascript Menghalangi render

Jika kita sudah melakukan pengujian menggunakan tools, seperti pagspeed insight atau GTmetrix ketika muncul pemberitahuan hapus javasrirpt yang memblokir perenderan, itu berarti kita tidak harus menghapus JS/javasrirpt. Karena JS juga memiliki peran penting bagi website atau blog dan javasrirpt adalah bagian dari elemen terbentuknya sebuah website.

Namun penempatan skrip pada bagian header atau footer tanpa dilakukan penundaan akan menggangu browser saat melakukan perenderan. Ini karena resources dari Javascript yang rata-rata berukuran besar akan dimuat juga secara bersamaan pada konten paruh atas. Request yang terlalu besar akan membuat halaman kita semakin lambat loading atau berat dalam hal pemuatannya.

Selain dari Javascript, iframe juga menggangu proses proses perenderan, seperti pemasangan atau embed video youtube, dailymotion, Vimeo dll.

Baca juga: Cara defer video  youtube

 

Cara Defer Parsing JavaScript

Menunda pemuatan javascript atau defer Parsing JavaScript benar-benar akan mempercepat loading web karena lebih mengutamakan HTML halaman terbuka lebih dahulu, setelah terbuka sempurna baru javascript akan loading atau bekerja. Cara defer parsing JavaScript yang baik merupakan solusi agar tidak menghalangi browser saat melakukan render halaman, sehingga kecepatan muat konten paruh atas tidak terganggu.

Cara menunda pemuatan javascript sangat sederhana dengan menambahkan baris kode sebelum tag body tutup (</body>) pada website atau blog miliki Anda, akan memberikan efek nyata terhadap kecepatan muat halaman.

Kode Defer Javascript

Dalam rangka mempercepat loading halaman yang pada akhirnya meningkatkan SEO bagi website atau blog yang kita kelola, kode defer javascript ini berasal dari master SEO Patrick Sexton harus kita adalah sebagai berikut.

<script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "javasript_anda_yang_di_defer.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>

Cara penggunaan kode defer .JS

Untuk melakukan defer atau menunda pemuatan javascript yang menggangu render, silakan mengganti tulisan berwarna merah dengan kode javascript pada website Anda yang terdapat peringantan dari Pagespeed insight (Hapus JavaScript yang Memblokir Perenderan).

Letakan kode di atas pada bagian sebelum tag body tutup </body>, untuk pengguna platform wordpress terdapat pada template bagian footer.php. Cara ini hampir sama dengan melakukan defer gambar agar loading blog lebih cepat.

Baca juga: Cara defer gambar agar loading blog cepat!

Contoh penempatan Kode defer Javascript

<script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "javasript_anda_yang_di_defer.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>
</body>
</html>

Demikian trik SEO cara defer parsing JavaScript agar kecepatan loading website kita semakin bagus!. Semoga bermanfaat, ada pertanyaan dan ide lain silakan pada kolom komentar. SALAM





Mohammad Aziz Ditulis Oleh

Buat Komentar Anda