Cara Mempercepat Loading Blog

Cara mempercepat loading blog dengan mudah dan simpel.

Kecepatan loading sebuah situs adalah suatu hal yang sangat wajib kita terapkan, karena kecepatan termasuk poin nomer 2 ( dua ) , poin nomer 1 ( satu ) masih bertahan di konten yang berkualitas, karena semua pengunjung membutuhkan suatu konten yang mereka cari, yang berisikan konten berguna, bermanfaat, dan berkualitas, akan tetapi konten yang sempurna juga belum seimbang dengan kecepatan loading situs tersebut.

Meskipun situs tersebut memiliki banyak konten yang berkualitas, namun loadingnya sangat buruk ( lemot ) semua pengunjung tidak akan berkesempatan membaca semua konten, dikarenakan loading situs yang lama, maka dari itu pengunjung akan meninggalkan situs tersebut dan mencari situs lain. Pada dasarnya semua pengunjung tidak suka menunggu loading dari sebuah situs, karena mereka berfikir masih banyak lagi situs yang bisa mereka kunjungi.

Pada garis bawahnya loading situs kalian harus cepat. Alangkah baiknya untuk kalian para blogger harus mengetahui apa saja penyebab terjadinya kelambatan loading pada situs blog, berikut ini beberapa penyebabnya yang sering kalian abaikan:

Terlalu besar size image yang kalian pergunakan dalam postingan
Terlalu banyak penggunaan Java Script
CSS yang tidak di optimalkan
Terlalu banyak menggunakan Widget
Terlalu banyak memasang kode iklan

Saya kira 5 ( lima ) hal yang saya tuliskan di atas sering kalian abaikan, yang paling sering di abaikan semua user blogger ada terletak pada penggunaan image yang di pakai untuk menghiasi konten. Untuk cara mengembalikan bahkan meningkatkan kecepatan loading blog Saya memiliki beberapa tutorial di bawah ini :

1. Compress CSS pada template blog kalian menggunakan CSS Minifier, cara ini akan sangat ampuh untuk meningkatkan loading situs, ambil semua css yang ada pada template blog, lalu paste ke kolom css, setelah di compress copy dan terapkan kembali ke tempat semula.

2. Hapus Widget yang ada pada bagian tata letak blogger kalian, gunakan yang penting-penting saja, buatlah tampilan situs simpel dan sedergana namun elegand.

3. Untuk yang sudah memakai iklan, gunakan kode iklan secukupnya saja, jangan terlalu banyak penggunaan karena akan mempengaruhi kecepatan situs.

4. Optimalkan penggunaan Java Script, pakai yang memang benar-benar harus di butuhkan, misalkan Java Script yang berguna untuk meningkatkan kecepatan, atau sejenisnya.

5. Gunakan image yang memiliki size yang kecil, maksimal ukuran size image 100 kb, apabila kalian sudah terlanjur banyak menggunakan image dengan size yang besar, atasi dengan java script Lazy Load, script ini akan mengkompress semua image yang ada pada situs blog, sehingga kecepatan akan lebih sempurna.

Cara meningkatkan kecepatan blog menggunakan Lazy Load:

Masuk ke dashbor blogger
Pilih Tema > Edit HTML
Cari kode </body> atu scrol paling bawah
Copy kode di bawah ini tepat di atas kode </body>

 <script type='text/javascript'>//<![CDATA[
function ignielLazyLoad(){eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('u B(){Y(v e=o.1r("B"),t=0;t<e.1q;t++)Q(e[t])&&(e[t].N=e[t].1p("1n-N"))}u Q(e){v t=e.1t();Z t.1x>=0&&t.1w>=0&&t.1v<=(y.1u||o.T.1m)&&t.1k<=(y.1c||o.T.1b)}v b=["\\r\\m\\m\\D\\G\\a\\f\\c\\M\\n\\p\\c\\a\\f\\a\\k","\\h\\f","\\r\\c\\c\\r\\l\\A\\D\\G\\a\\f\\c","\\g\\h\\r\\m","\\p\\l\\k\\h\\g\\g","\\V\\1a\\1e\\R\\h\\f\\c\\a\\f\\c\\M\\h\\r\\m\\a\\m","\\w\\p\\a\\1l\\p\\c\\k\\n\\l\\c","\\r","\\1f\\w\\a\\k\\L\\1j\\a\\g\\a\\l\\c\\h\\k\\W\\g\\g","\\g\\a\\f\\q\\c\\A","\\w\\p\\a\\k\\W\\q\\a\\f\\c","\\c\\a\\p\\c","\\m\\h\\l\\w\\F\\a\\f\\c\\D\\g\\a\\F\\a\\f\\c","\\1i\\h\\m\\L","\\l\\g\\n\\l\\1g","\\p\\l\\k\\h\\g\\g\\1h\\h\\J","\\c\\h\\J","\\q\\a\\c\\S\\h\\w\\f\\m\\n\\f\\q\\R\\g\\n\\a\\f\\c\\1z\\a\\l\\c","\\A\\k\\a\\X","\\a\\1y\\a\\l","\\q\\a\\c\\D\\g\\a\\F\\a\\f\\c\\S\\L\\1F\\m","\\p\\l\\k\\h\\g\\g\\U\\a\\n\\q\\A\\c","\\n\\f\\f\\a\\k\\U\\a\\n\\q\\A\\c","\\J\\k\\a\\G\\a\\f\\c\\V\\a\\X\\r\\w\\g\\c","\\n\\c\\a\\F"];u I(d,j){y[b[0]]?y[b[0]](d,j):y[b[2]](b[1]+d,j)}I(b[3],B),I(b[4],B),o[b[0]](b[5],u(){b[6];Y(v d=o[b[8]](b[7]),j=d[b[9]],s=/1D|1B/i[b[11]](1G[b[10]])?o[b[12]]:o[b[13]],C=u(d,j,s,C){Z(d/=C/2)<1?s/2*d*d*d+j:s/2*((d-=2)*d*d+2)+j};j--;){d[b[1C]](j)[b[0]](b[14],u(d){v j,E=s[b[15]],x=o[b[1A]](/[^#]+$/[b[19]](1H[b[18]])[0])[b[17]]()[b[16]],z=s[b[1d]]-y[b[1s]],O=z>E+x?x:z-E,K=1o,H=u(d){j=j||d;v x=d-j,z=C(x,E,O,K);s[b[15]]=z,K>x&&P(H)};P(H),d[b[1E]]()})}});',62,106,'||||||||||x65|_0x1b5d|x74|_0xdd48x2||x6E|x6C|x6F||_0xdd48x3|x72|x63|x64|x69|document|x73|x67|x61|_0xdd48x4||function|var|x75|_0xdd48x7|window|_0xdd48x8|x68|lazy|_0xdd48x5|x45|_0xdd48x6|x6D|x76|_0xdd48xb|registerListener|x70|_0xdd48xa|x79|x4C|src|_0xdd48x9|requestAnimationFrame|isInViewport|x43|x42|documentElement|x48|x44|x41|x66|for|return|||||||||||x4F|clientWidth|innerWidth|21|x4D|x71|x6B|x54|x62|x53|left|x20|clientHeight|data|900|getAttribute|length|getElementsByClassName|22|getBoundingClientRect|innerHeight|top|right|bottom|x78|x52|20|trident|24|firefox|23|x49|navigator|this'.split('|'),0,{}));} eval(function(p,a,c,k,e,d){e=function(c){return c.toString(36)};if(!''.replace(/^/,String)){while(c--){d[c.toString(a)]=k[c]||c.toString(a)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('j 4=["\\7\\9\\9\\e\\d\\a\\b\\8\\i\\g\\h\\8\\a\\b\\a\\k","\\f\\c\\7\\9","\\7\\8\\8\\7\\m\\l\\e\\d\\a\\b\\8","\\c\\b\\f\\c\\7\\9"];5[4[0]]?5[4[0]](4[1],6,!1):5[4[2]]?5[4[2]](4[1],6):5[4[3]]=6;5[4[0]]?5[4[0]](4[1],6,!1):5[4[2]]?5[4[2]](4[1],6):5[4[3]]=6;',23,23,'||||_0xdfb4|window|ignielLazyLoad|x61|x74|x64|x65|x6E|x6F|x76|x45|x6C|x69|x73|x4C|var|x72|x68|x63'.split('|'),0,{}));
//]]></script>

Klik simpan template.

Balik lagi ke Edit HTML cari kode yang mirip-mirip seperti di bawah ini:

<img expr:alt='data:post.title' expr:title='data:post.title' expr:src='resizeImage(data:post.firstImageUrl, 225, "225:170")'/>

Lalu tambahkan sedikit kode class='lazy' sesudah kode <img hingga tampilannya seperti berikut ini.

<img class='lazy' expr:alt=''data:post.title' expr:title=''data:post.title' expr:src='resizeImage(data:post.firstImageUrl, 225, "225:170")'/>

Jika ada beberapa kode yang sama pada template blog kalian, rubah semuanya, setelah itu simpan template, tahap mempercepat loading situs blog sudah selesai sampai disini. Sekarang lihat dan rasakan perbedaan nya.

Apabila menurut kalian konten ini bermanfaat, silahkan di share ke semua sosial media yang kalian sering pergunakan, dan juga bila ada kritik dan saran mengenai konten ini, harap berikan komentar di kolom yang sudah di sediakan. Terimakasih.