Cara Meningkatkan Kecepatan Loading Blog

Akhir-akhir ini, saya sedang tertarik untuk membuat supaya blog saya menjadi responsive dan fast loading. Awalnya, saya lebih mementingkan tampilan blog dengan menghiasi blog saya menggunakan banyak widget dan plugin. Akhirnya, setelah saya memperbaiki template blog ini hingga fast loading, Saya puas karena perubahan yang terlihat sangat maksimal.

Tidak lama setelah blog Supervba memperoleh performa skor seperti tampak pada gambar di atas, yakni pada tanggal 3 Agustus 2015, kurang lebih 1 hari kemudian, hari ini, saya mendapat hadiah dari Google berupa site links (Tautan Situs). Saat menggunakan domain yang lama : supervba.blogspot.com, saya pernah mendapat site links tapi tidak bertahan lama hingga site links itu hilang (diambil Google kembali). Hilangnya tautan situs karena saya sempat melakukan kesalahan dengan mengirim ulang robot.txt saya. Namun akhirnya, domain baru ini : www.supervba.com pun berhasil mendapat site links lagi. Dari kejadian ini, saya kira, faktor fast loading juga menjadi penentu mudah tidaknya mendapat site links Google.

Sebagai informasi bahwa untuk mendapat site links, kita harus mendaftarkan (mendemosikan) URL kita melalui Google Webmaster. Sebelum performa skor blog saya mencapai hasil seperti di atas, saya sudah terlebih dahulu mengirimkan permintaan untuk mendemosikan URL saya menjadi site links.

Setelah penjelasan di atas, apakah anda masih bertanya jika fast loading ini penting atau tidak?. Sekarang, menurut saya ini sangat penting. Jika blog kita fast loading, kita akan lebih nyaman untuk menelusuri artikel kita lebih jauh, begitu pula pengunjung kita. Template bagus memang menarik tapi template yang fast loading jauh lebih menarik bagi saya saat ini.

Bagaimana cara mengetahui apakah blog kita fast loading atau tidak?. Untuk mengetahui blog kita fast loading tidak, kita bisa mengunjungi situs GTmetrix.  Jika kita merasa blog kita masih lambat loadingnya, dari pada kita mengganti template, lebih baik kita perbaiki.

Tips Meningkatkan Kecepatan Loading Blog

Berikut ini beberapa tips untuk meningkatkan kecepatan blog kita. Simak ya.

1. Mengurangi widget

Jika ingin blog kita fast loading, mau tidak mau kita harus bisa mengatur banyak widget di blog. Semakin banyak, akan semakin lambat loading blog kita. Apalagi jika widget blog itu sebagian besar berupa eksternal link dari pihak ketiga seperti histats, youtube button, alexa, widget translate dan masih banyak lagi. Sebaiknya pakai widget milik blogger seperti popular posts, arsip, label dan lainnya. Jadi, gunakan widget/gadget dengan sebijak mungkin, bukan semaunya kita.

2. Mengedit html untuk widget/gadget

Ada 1 trik yang harus kita lakukan setiap kali kita selesai membuat sebuah widget baru. Untuk itu, silahkan cari letak posisi widget baru tersebut melalui menu Edit HTML. Kemudian, jika sudah menemukan widget itu, silahkan hapus kode berikut ini.

   <b:include name='quickedit'/>

3. Menghindari plugin

Beberapa widget itu ada yang berbentuk plugin. Plugin membutuhkan loading yang lebih lama daripada widget biasa. Untuk itu, sebaiknya tidak perlu menggunakan plugin. Ini pun yang disarankan oleh Google bahwa kita harus menghindari penggunaan Plugin. Jika perlu silahkan tes blog kita menggunakan Page Speed Insight.

Menghilangkan Facebook Comment

Salah satu plugin pada blog adalah Facebook Comments. Berikut ini cara menghilangkan plugin facebook comments yang ada di blog. Sebagai gantinya, kita hanya menggunakan kolom komentar default milik blogger. Simak ya.

a. Silahkan ke menu Edit HTML. Lakukan pencarian (Ctrl+F) terhadap teks 'comment'. temukan kode facebook comment berikut di atas </b:skin>. Jika sudah, silahkan dihapus.

/* facebook comments */
.fbbox-comments {
box-sizing: border-box;
-moz-box-sizing: border-box;
background:#fff;
border:1px solid #e5e5e5;
margin: 0 0 20px;
}
.fb-comments{width: 100% !important;}
.fb-comments iframe[style]{width: 100% !important;}
.fb-like-box{width: 100% !important;}
.fb-like-box iframe[style]{width: 100% !important;}
.fb-comments span{width: 100% !important;}
.fb-comments iframe span[style]{width: 100% !important;}
.fb-like-box span{width: 100% !important;}
.fb-like-box iframe span[style]{width: 100% !important;
}

b. Selanjutnya, lakukan pencarian (Ctrl+F) terhadap teks 'facebook'. temukan kode facebook comment berikut di atas </head>.

.fb-comments{width: 100% !important;}

.fb-comments iframe[style]{width: 100% !important;}

.fb-like-box{width: 100% !important;}

.fb-like-box iframe[style]{width: 100% !important;}

.fb-comments span{width: 100% !important;}

.fb-comments iframe span[style]{width: 100% !important;}

.fb-like-box span{width: 100% !important;}

.fb-like-box iframe span[style]{width: 100% !important;}

.fotleft{float:left}

.fotright{float:right;text-align:right;}

Sekarang lakukan dengan hati-hati, hapus bagian ini saja ya.

.fb-comments{width: 100% !important;}

.fb-comments iframe[style]{width: 100% !important;}

.fb-comments span{width: 100% !important;}

.fb-comments iframe span[style]{width: 100% !important;}

Selanjutnya, silahkan temukan juga bagian berikut dan silahkan dihapus. Ingat, lakukan dengan hati-hati.

<!-- facebook comments responsive JS -->
  <b:if cond='data:blog.pageType == &quot;item&quot;'>
<script>
//<![CDATA[
$(window).bind("load", function(){    
 var container_width = $('.fbbox-comments').width();    
 var fburl=(window.location.href);
 var fbfix=fburl.indexOf('?');
 var fburlfix = fburl.substring(0, fbfix != -1 ? fbfix : fburl.length); 
$('.fbbox-comments').html('<div class="fb-comments" ' + 
'data-href="' + fburlfix + '"' +
' data-width="' + container_width + '" data-num-posts="5"></div>');
FB.XFBML.parse( );    
}); 
//]]>
</script>
<div class='fbbox-comments' style='width:100%;margin-top:20px'>
<div class='fb-comments' data-num-posts='2' data-width='680' expr:data-href='data:blog.url'/>
</div>
  </b:if>

4. Mengurangi ekstenal link.

Beberapa langkah di atas sebenarnya sudah memadai untuk meningkatkan kecepatan blog kita. Sekarang, silahkan cek terlebih dahulu kecepatan loading blog kita di GTmetrix. Jika sudah seperti performa di atas, itu sudah cukup. Tapi jika mau lebih responsive lagi, kita bisa menghapus css maupun javascript untuk link-link eksternal kita seperti tombol social media (facebook, twitter, youtube, g+, dll) yang pada halaman utama. Ingat, tombol social yang dimaksud bukan tombol social media untuk share postingan ya. Kalau tombol social untuk share postingan ya tetap harus ada. Saya sendiri masih menggunakan tombol social media tersebut.

5. Menghapus css bundle punya blogger.

Sebenarnya, proses menghapus css bundle dari blogger ini sudah lama saya lakukan. Jika anda merasa perlu untuk melakukan ini, silahkan saja, dengan tetap memperhatikan hasil uji blog kita tadi. Untuk menemukan css bundle milik blogger, silahkan di cari di bawah kode <head> dalam HTML kita, biasanya di bawah meta tag  HTML blog. Untuk blog ini sendiri sudah tidak menggunakan css bundle pada HTML.

6. Menggunakan alat tes untuk menemukan masalah dan solusi lainnya.

Untuk mengetahui informasi lengkap tentang kecepatan loading blog, kita bisa mengujinya dengan menggunakan alat tes dari Google atau pihak ketiga lainnya. Jika anda mau silahkan tes kecepatan blog anda dengan GTmetrix dan Page Speed Insight. Selain bisa melihat skor performa blog, kita juga akan mendapat rekomendasi cara meningkatkan skor performa itu lebih baik lagi.

Begitulah cara meningkatkan kecepatan loading blog. Blog anda milik anda, suka-suka saja. 

Ikuti informasi perkembangan blog kami melalui Fanspage Facebook kami di Supervba. Semoga berguna.