Cara Mempercepat Loading Blog atau Website 'Tanpa Ganti Tema maupun Template'

Tips & Trick - Sering kali para blogger merasa resah terhadap kecepatan atau loading pada blog mereka masing-masing, ingin mengganti template yang ada namun terasa sudah nyaman akan tampilan yang ada.

Namun tak segelintir orang yang tahu bahwa kecepatan pada blog mereka dalam meload/menampilkan konten didalamnnya sangatlah berperan penting terhadap kenyamanan pengunjung hingga pengindexan mesin telusur dalam menampilkan artikel pada halaman utama mereka.

Nah untuk itu saya mempunyai cara yang mungkin bisa untuk diterapkan pada masing-masing template kalian agar meringankan beban berat pada blog kalian :D, Namun sebelumnya cara ini dikhususkan untuk Domain yang dihosting ke blogspot. Simak ulasannya berikut ini :

1. MINIFY CSS

Cascading Style Sheet (CSS), Sumber elemen inilah yang berperan sebagai pengatur warna, besar huruf, sampai tata letak tampilan yang dapat menyebabkan blog terasa lambat apalagi jika template yang agan gunakan menampilkan tata letak huruf font yang banyak, pastinya hal itu akan memakan waktu respon server saat terhubung ke visitor  untuk itu memperkecil CSS adalah pilihan tepat agan dapat memperkecilnya malalui tools online seperti website :

• https://cssminifier.com/
• https://www.minifier.org/
• https://csscompressor.com/

2. MENEMPELKAN JAVASCRIPT LAZY LOADING PADA TEMPLATE

Lazy Loading akan membantu dalam pemuatan resource media seperti gambar dan video cara ini akan mengehemat waktu penundaan tampilan media yang tidak penting dan  hanya akan tampil bila visitor anda menscroll halaman blog anda. dan cara penggunaan lazy loading sendiri yaitu :

1. Buka Blog
2. Tema => Edit HTML
3. Cari

atau </Head> lalu paste kode di bawah ini diatasnya

<script charset=’utf-8′ src=’http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js’ type=’text/javascript’/>
<script src=’http://cuerosb.googlecode.com/files/cueros%20-lazyload.js’ type=’text/javascript’/><script charset=’utf-8′ type=’text/javascript’>$(function() {
$("img").lazyload({placeholder :
"https:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwv-VmCjikMhIC07zijQeQaC3uGYBbM0k2fkKX0k2T3Is-4th5Al6d6Hmh1ql1Ls2GNi2ZnJtUNBQfzCr_GVeIOCsikhWo7kbYTIR7O5lUwjGMx95RUohhNqGWP_47FXHFXs7KyQmfSEY/",threshold
: 200});
});
</script> 

3. MENGGUNAKAN EXPIRES HEADER

Expires Header sebenarnya cara ini akan membebankan data visitor di awal dan gunanya bukan untuk mempercepat loading blog saat pengguna pertama kali mengunjungi blog anda, namun hal ini  akan memberikan hal efektif saat visitor datang kembali ke blog anda. cara kerjanya adalah untuk mengatur waktu kadalaurasa dari sebuah browser untuk menampilkan, Gambar, CSS, dan Javascript pada halaman yang sama di cache. untuk penggunaanya adalah sebagai berikut ini :

1. Buka Blog
2. Tema => Edit HTML
3. lalu paste kode di bawah ini sebelum 

atau </Head>

<include expiration=’7d’ path=’*.css’/>
<include expiration=’7d’ path=’*.js’/>
<include expiration=’3d’ path=’*.gif’/>
<include expiration=’3d’ path=’*.jpeg’/>
<include expiration=’3d’ path=’*.jpg’/>
<include expiration=’3d’ path=’*.png’/>
<meta http-equiv=”expires” content=”sat, 02 jun 2020 00:00:00 GMT”/> 

4. MENGGANTI PENGGUNAAN JAVASCRIPT DARI EXTERNAL KE INTERNAL

Keuntungan menggunakan javascript internal adalah respon waktu server yang lebih efektif tanpa harus memanggil data dari server utama ke server lain terlebih dahulu, untuk cara pengubahannya adalah sebagai berikut ini.

1. Buka Blog
2. Tema => Edit HTML
3. lalu cari kode script biasanya akan disimpan dengan domain lain seperti subdomain dengan awalan "cdn" seperti script di bawah ini

 <script src='https://cdn.rawgit.com/lewatinaja/lewatinaja.js'/> 

Selanjutnya buka link tersebut maka akan muncul elemen dan variable javascript seperti di bawah ini contohnya :

 // file-eksternal.js
alert("Kode Javascript dari File Eksternal"); 

lalu ganti script dibawah ini

<script src='https://cdn.rawgit.com/lewatinaja/lewatinaja.js'/> 

menjadi seperti berikut ini :

<script type="text/javascript">
//<![CDATA[
// file-eksternal.js
alert("Kode Javascript dari File Eksternal");
//]]>
</script> 

nah javascript anda sudah berada di dalam satu source pada blog agan yang akan membuat kinerja server tidak akan terbebani lagi karena harus memanggil source di server yang berbeda.