Cara Mempercepat Loading Blog Dengan Lazy Load

Cara Mempercepat Loading Blog Dengan Lazy Load - Mempercepat suatu blog adalah tujuan untuk para blogger agar para visitor tidak merasa kesal atas kelamaan loading untuk memasuki blog anda.

Cukup banyak cara untuk mempercepat loading blog, yakni salaah satunya adalah dengan memasang plugin lazy load di blog anda. Kali ini CaraSatuKu akan berbagi tutorial bagaimana cara memasang lazy load di blog anda agar visitor pun merasa tenang hehehe. Tapi sebelum itu saya ingin memberitahu apasih itu Lazy load ?

Apa Itu Lazy Load ?

Lazy load adalah sebuah plugin atau script yang dibangun dan dikembangkan khusus untuk flatform blogspot, Fungsinya untuk menunda pemanggilan objek ketika objek masih belum dibutuhkan. Dengan kata lain, gambar, video, dan komponen lain yang ada dalam blog tidak akan dimuat sebelum anda menyentuh atau mengarahkan kepada konten tersebut.

Sehingga dengan ini, loading blog akan sedikit berkurang karena hanya memuat halaman yang terbuka saja, ketika anda scroll cursor anda ke bawah, baru disini semua halaman akan dimuat secara keseluruhan.

Oke langsung saja Ke tutorialnya, silahkan bisa langsung coba dan terapkan di blog anda :

1. Buka Blogger => Template => Edit HTML => Tambahkan kode dibawah ini sebelum </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/AVvXsEgQnHOcfzJ0nq4FUKdjNs3_6HVeNGIJXdSO2EOzrAA2RIUDPzXdPjj7K27bd0-upeCoB0GrS_cl_YRFZj1el8dqt_2kTvQle91UAnX73kRZ_Le4CFdot9D0KaELfHnNCflSODAhbbnQlAIa/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})}); //]]> </script>

2. Kalau sudah simpan Template dan lihat hasilnya blog akan terasa lebih ringan.

Sebagai penutup, begitu kamu selesai menerapkan plugin Lazy Load di Blogger, maka, kamu akan mendapati gambar di blogmu baru akan termuat begitu kamu melakukan scroll kebawah, optimasi ini cocok sekali untuk blog yang banyak menggunakan ilustrasi gambar dalam setiap artikelnya.

Bagaimana langkah - langkahnya cukup mudah bukan, Cara Mempercepat Loading Blog Dengan Lazy Load ?  Oke bro / sis cukup sampai disini pembahasan saya kali ini. Jika ada yang kurang di mengerti silakan kalian tanyakan pada kolom komentar dibawah.

Berbagi :