Cara Mengatasi Render-Blocking Javascript Dari Jquery

(isi iklan)
Render-Blocking JavascriptJquery seperti ini perlu diperbaiki ketika blog dicek di PageSpeed. Karena saya pikir saya sudah memasang Jquery ini dengan benar. Namun kelamaan kepikiran juga bagaimana caranya untuk mengatasi Render-Blocking Javascript Dari Jquery ini. Mungkin karena saya takut salah dalam mengatasinya sehingga keberanian untuk mencoba mengatasinya menjadi hilang.

Akhirnya saya mencoba mengatasi ketakutan saya ini dan mencoba menerjemahkan isi halaman dari panduan Google untuk mengatasi Render-Blocking Javascript dengan alamat berikut: https://developers.google.com/speed/docs/insights/BlockingJS

Di situ saya menemukan petunjuk untuk menggunakan atribut HTML async pada Jquery-nya. Sebelumnya Jquery saya simpan di edit HTML sebagai berikut:

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

Kemudian saya mencoba menambahkan atribut HTML async menjadi seperti berikut:

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

Kemudian saya mengujinya pada halaman postingan blog untuk memastikan semua elemen blog berjalan seperti sebelumnya. Dan hasilnya halaman postingan tidak mengalami kendala apa pun, berjalan seperti sebelumnya. Namun ketika saya mencoba pada halaman depan blog, javascript pada post untuk mengatur gambar thumbnailnya agar naik dan turun ketika dihover menjadi tidak berjalan, namun saya biarkan terlebih dahulu. Kemudian saya cek blog di PageSpeed untuk memastikan apakah Render-Blocking Javascript dari Jquery ini sudah teratasi atau belum. Dan hasilnya cukup menakjubkan, seperti pada gambar di bawah ini.

Dengan mengatasi satu hal tersebut, skor speed blognya naik dengan menakjubkan. Tentunya ini menjadi hal yang cukup bagus untuk blog Kompi Ajaib sendiri. Namun permasalahan masih tersisa di homepage blog, untuk mengatasi javascript yang mengatur thumbnail untuk naik turun ketika dihover, saya akhirnya menggunakan CSS untuk mengatur naik turun thumbnail ketika dihover dan menghapus javascriptnya itung-itung untuk merampingkan size blog juga.

Bagaimana dengan blog Anda? Jika mengalami hal yang sama seperti Kompi Ajaib yaitu Render-Blocking Javascript dari Jquery, coba saja pengalaman saya ini siapa tahu bisa berhasil juga pada blog Anda.

Untuk Render-Blocking Javascript itu sendiri jika diartikan itu adalah javascript tersebut menyebabkan loading pada halaman blog ketika diakses baik melalui handphone, ipad, atau desktop. Loading itu sendiri disebabkan karena browser harus mendownload terlebih dahulu javascriptnya sebelum halaman berhasil dimuat.

Tertunya hal ini akan berakibat kurang baik di mata search engine khususnya Google. Jika kita peduli dengan peringkat blog di serp, tentunya hal ini harus diatasi karena Google akan menyingkirkan blog atau web dari serp yang memiliki loading lambat atau blog yang menyebabkan pengunjungnya harus menunggu waktu yang lama untuk membuka suatu halaman sebagaimana yang ditunjukan di PageSpeed seperti gambar di atas tadi.

Perlu di ingat hanya Javascript tertentu saja yang wajib di tambah async='async'

Judul Cara Mengatasi Render-Blocking Javascript Dari Jquery
Deskripsi Render-Blocking Javascript Jquery seperti ini perlu diperbaiki ketika blog dicek di PageSpeed . Karena saya pikir saya sudah memasang Jquer...
Author
Author Rating
89,99%/ 100% Suara Dari 9999 Ulasan
Share this with short URL: Get Short URLloading short url
Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di IDCEPU
Tag : Blogger, SEO
0 Komentar untuk "Cara Mengatasi Render-Blocking Javascript Dari Jquery"

Silahkan tinggalkan komentar anda di bawah ini,
Adapun peraturan berkomentar di blog ini:
1.Tidak komentar SPAM
2.Tidak komentar PROMOSI
3.Tidak komentar yang mengadung unsur SARA
4.Berkomentar dengan SOPAN
Salam IDCEPU

Back To Top