$type=carousel$cols=3

Script Lazy Mempercepat Loading Blog

SCRIPT LAZY LOAD GAMBAR UNTUK MERINGANKAN LOADING BLOG

Script Lazy Mempercepat Loading Blog
Selamat Datang di Blog Orang IT . Sharing tips ringan bagi anda sekalian yang merasa loading blognya berat coba gunakan script lazy load untuk mempercepat loading blog agar lebih maksimal dan power full . Script lazy ini bisa digunakan untuk pengguna blog gratisan seperti blogger

Lazy load gambar ini fungsinya untuk mengoptimalkan loading gambar diblog agar lebih cepat , bagi pengguna wordpress tidak akan pernah direpotkan dengan masalah gambar yang berat karena banyak plugin yang bebas digunakan untuk mengoptimasi gambar agar ringan saat dimuat berbeda dengan blogger yang harus mencompress sendiri gambar sebelum diupload agar ukuranya lebih kecil sehingga ringan saat blog dimuat
Sementara untuk blog besar seperti soudmeloaud  , labnol dll mereka menggunakan CDN untuk mengoptimalkan loading blognya dengan mencari sumber terdekat berdasarkan negara pengunjung sementara untuk blogger bisa menggunakan script lazy ini untuk mempercepat loading blog

Beberapa kelebihan dari penggunaan script lazy load image di blogger :
  • Membuat speed blog kamu jadi tambah cepat.
  • Mempercepat proses load gambar di blog kamu.
  • Visitor menjadi senang otomatis pageview kamu bertambah.
  • Seo friendly sudah pasti.
Beberapa kekurangan dari script lazy load image blogger :
  • Jika visitor tidak mengaktifkan javascrip pada browser nya maka dia tidak akan melihat gambar postingan.
  • Jika kamu memiliki 4 buah gambar biasanya script ini akan menampilkan 2 - 3 gambar saja.

Cara pasang script crazy load gambar diblogger

1. Login dashboard - edit html

2. Cari kode </head> lalu letakkan script lazy ini tepat diatasnya

(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:"http://i22.servimg.com/u/f22/15/42/72/40/grey10.gif",effect:"fadeIn",threshold:"-50"})})//]]></script></span>

Jika error gunakan saja script ini
<span style="font-family: verdana, geneva, sans-serif;">
<script type='text/javascript'>//<![CDATA[
(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:"http://i22.servimg.com/u/f22/15/42/72/40/grey10.gif",effect:"fadeIn",threshold:"-50"})})//]]></script></span>
3. Selesai sekarang coba cek blog anda seharusnya sudah lebih ringan

Demikian postingan saya mengenai script lazy load untuk meringankan loading gambar blog semoga bermanfaat jika ada alternatif silahkan berkomentar yang relevans sekian dan terimakasih sudah berkunjung diblog sederhana ini .


Follow Blog Orang IT dan jangan lupa Like FansPage Helmykkediri dibawah serta jangan lupa untuk klik iklan yang ada pada Blog ini.untuk biaya perawatan admin

COMMENTS

BLOGGER: 1
Loading...
Nama

Android,3,Blog,335,Info,203,Islami,43,Software,73,Tutorial,118,Web,18,
ltr
item
BLOG ORANG IT 2017: Script Lazy Mempercepat Loading Blog
Script Lazy Mempercepat Loading Blog
Lazy load gambar ini fungsinya untuk mengoptimalkan loading gambar diblog agar lebih cepat , bagi pengguna wordpress tidak akan pernah direpotkan dengan masalah gambar yang berat karena banyak plugin yang bebas digunakan
https://1.bp.blogspot.com/--JdMEp0qRGo/WQwS8aR7p2I/AAAAAAAADU0/MA4D9fpNROwrw4vFfHrexAP-X5QLberJACLcB/s320/lazyload%2Bmeringankan%2Bblog.jpg
https://1.bp.blogspot.com/--JdMEp0qRGo/WQwS8aR7p2I/AAAAAAAADU0/MA4D9fpNROwrw4vFfHrexAP-X5QLberJACLcB/s72-c/lazyload%2Bmeringankan%2Bblog.jpg
BLOG ORANG IT 2017
http://www.helmykkediri.com/2017/05/script-lazy-mempercepat-loading-blog.html
http://www.helmykkediri.com/
http://www.helmykkediri.com/
http://www.helmykkediri.com/2017/05/script-lazy-mempercepat-loading-blog.html
true
7204675838149040268
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy