Lazy Load
Salah satu dari banyaknya faktor SEO google adalah kecepatan loading, semakin ringan dan cepat loading suatu blog maka akan semakin baik di mata google dan tentu saja itu akan menambah nilai seo dari blog itu sendiri. lalu bagaimana dengan blog yang kamu kelola ?
Lazy Load adalah salah satu trick yang sudah banyak di terapkan di berbagai penggunaan template blog untuk mempercepat loading saat situs laman di muat, Script lazy load ini bekerja pada gambar yang nantinya akan di muat secara berurutan sesudah situs laman kamu sepenuhnya sudah di muat baru gambar ini akan di muat dengan cepat.
Script lazy load ini sangat di sarankan bagi pengguna situs blog yang memiliki kecepatan loading yang lambat saat di muat, dengan memasang script lazy load ini blog akan menjadi lebih ringan dari sebelumnya, namun script ini juga memiliki dampak kekurangan yang bisa memberikan dampak tidak berjalanya script lain, maka dari itu sangat di sarankan sebelum kamu memasang script lazy load ini pastikan kamu sudah melakukan backup terlebih dahulu terhadap template yang kamu gunakan.
Pernahkah kamu mengunjungi satu blog yang loadingnya lama lalu apakah kamu merasa nyaman? jawabanya pastilah tidak, terutama saya sendiri ketika saya mengunjungi satu blog yang loadingnya lama maka saya akan lebih memilih untuk menutupnya dan mencari sumber bacaan lain, nah, kamu sendiri bagaimana ? apakah sama juga ?
Jadi bisa disimpulkan loading blog yang lama akan membuat pengunjung blog kita kabur dan tidak jadi membaca artikel yang kita posting di blog, bagi seorang blogger pembaca itu adalah raja jadi dalam hal ini kenyamanan pembaca harus jadi prioritas utama kita agar pengunjung betah.
Loading blog yang lama telah menjadi penyebab yang cukup besar untuk membuat pengunjung mengurungkan niatnya untuk membaca artikel yang kita buat, oleh karena itu kita harus segera mengatasinya. Jika loading blog kamu termasuk berat atau lemod atau bahkan super lelet, kita bisa menggunakan solusi dengan menyisipkan kode jquery ke dalam template, kita bisa menambahkan Lazy Load untuk membuat loading blog menjadi lebih ringan daripada sebelumnya.
Baca juga: Cara Agar Artikel Cepat Terindek Google Dengan 1 kali Klik
Ada banyak kode lazy load yang bisa kita temukan di postingan tutorial tetapi jangan sampai salah pilih, kamu harus melakukan pengecekan kecepatan sebelum dan sesudah memasang lazy load karena berdasarkan pengalaman, tidak jarang saya menemukan kode lazy load yang tidak ada efeknya sama sekali, justru kode yang tidak ada efeknya itu malah memberatkan loading blog karena adanya penambahan zonk kode di template. Tapi tenang saja kode lazy load yang akan saya share ini insaalloh masih kode yang aktif alias bisa memberikan efek meringankan loading blog heee...hee, biar gak takabur deh..... .
Cara Memasang Lazy Load
Cara memasangnya cukup mudah, kamu hanya perlu menyisipkan kode di bawah ini tepat di atas kode </body>.
<script type='text/javascript'>
//<![CDATA[
// Lazy Load
(function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqi0KH0OITwSonAtJcjudLchm7konX2be14GGS21luP3sqJMa3lYaGfDGj_VMRW22yBznOvcEO0QTNTrX4vFNis-adYvy65wAZrE-AXSKcGEekt3_gWV9m-we0I5VBEH49ngZNETxP_Vo/s1600/aakshare.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>
Silahkan kamu copy kode di atas dan pastekan tepat di atas kode
</body>.
selanjutnya kamu cek kecepatan loading blog tersebut, kamu bisa mengunjungi halaman ini https://developers.google.com/speed/pagespeed/insights atau klik
disini
Dilihat dari hasilnya kecepatan blog saya ini bertambah 5 poin dari 72 menjadi 77 , meski masih banyak yang perlu di perbaiki agar lebih ringan lagi, tapi kenaikan 5 poin ini terbilang lumayan dan mampu membantu menaikan performa blog. bagaimana ? menarik bukan......
Baca juga: Cara Mengetahui Pengunjung Blog Dengan Menggunakan Histat
Demikianlah sedikit share tips tentang Cara Mempercepat Loading Blog Dengan Lazy Load, semoga dapat membantu kamu dalam membangun blog yang SEO, selain itu juga memberi rasa nyaman pada pengunjung. selamat mencoba, semoga berhasil.
Terimakasih telah berkunjung dan menyempatkan untuk membaca.
loading...
Belum ada tanggapan untuk "Cara Mempercepat Loading Blog Dengan Lazy Load "
Posting Komentar
Peraturan Berkomentar
[1] Dilarang menghina, Promosi (Iklan), Menyelipkan Link Aktif, dsb
[2] Dilarang Berkomentar berbau Porno, Spam, Sara, Politik, Provokasi,
[3] Berkomentarlah yang Sopan, Bijak, dan Sesuai Artikel, (Dilarang OOT)