Tips agar Loading Blog Enteng Plus Ngebut, Whuuss

Ditulis oleh: Maseteguh Blog Must Teguh Updated at : 12:30 AM
28 comments
Tips mempercepat loading blog. Kecepatan loading sebuah blog sangat dipengaruhi oleh kode-kode pemrograman yang ada pada template. Untuk itu dalam memilih template, jangan cepat tergiur oleh judul artikel dengan embel-embel “fast loading’.

Banyak alat yang bisa dipakai untuk mengecek kecepatan loading blog. Salah satunya pagespeed insight. Tool gratis dari Google ini memiliki tingkat akurasi yang jempolan lengkap dengan solusi perbaikan yang disarankan untuk Anda lakukan.

Silahkan cek loading blog Anda saat ini juga. Jika score yang Anda peroleh menunjukkan indikator warna merah atau kuning, Anda wajib waspada. Itu sinyal yang memberitahu kerja loading blog Anda masih lamban dan butuh perbaikan.

Lewat artikel ini saya bagi tips yang bisa Anda terapkan agar loading blog Anda lebih enteng dan ngebut..whuusss.

Tips agar Loading Blog Enteng Plus Ngebut,

Tips agar Loading Blog Ringan dan Cepat


Loading halaman super cepat (versi desktop dan mobile) sangat di sukai oleh mesin pencari dan penggunanya.

Dimata search engine, blog dengan loading yang ringan memiliki struktur yang mudah untuk dirayapi. Bagi pengunjung, cepatnya waktu loading tak akan membuat mereka lama menunggu.

Nah, berikut ini tips yang saya sarankan untuk Anda lakukan, demi kepuasan pembaca blog Anda.

1. Kode Jquery harus asinkron

Hampir di semua template sebuah website terdapat kode script jquery. Jquery adalah library JavaScript multiplatform yang dirancang agar menyusun client-side script pada file HTML menjadi lebih mudah.

Dengan syntax jquery, para pengembang template lebih gampang dalam merancang berbagai plugin berbasis JavaScript. Plugin inilah yang dipakai untuk menyusun abstraksi seperti interaksi animasi, dan efek yang kompleks dari berbagai widget yang dapat dikonfigurasikan.

Namun begitu, penempatan kode jquery pada template haruslah dibarengi dengan kode asinkron agar kerja loading blog jadi lebih ringan dan cepat. Silahkan buka template Anda, cari kode jquery seperti ini:

<script src='//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'/>

Untuk menambah kecepatan loading blog, tambahkan kode asinkron (tulisan warna biru) hingga jadi seperti di bawah ini.

<script async='true' src='//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'/>

2. Hapus kode jquery pada widget

Saat memasang widget pada blog, perhatikan kode script nya. Hapus jika ada kode jquery di dalamnya. Anda tak perlu khawatir jika widget tidak akan muncul, karena secara otomatis kode jquery nya sudah di load dari template Anda.

Andai kode jquery pada widget tidak dihapus, justru akan membebani loading blog. Resiko nya tentu widget akan lama tampil, atau muncul tapi tidak sempurna. Dan dikhawatirkan akan menimbulkan konflik jquery pada template.

3. Kompres gambar

Setiap artikel butuh gambar untuk visualisasi nya. Gambar pun bisa di optimasi untuk mendekatkan artikel di halaman bergengsi. Masalahnya tiap gambar punya muatan file dan format yang berbeda. Perhatikan kedua hal itu saat memasang gambar untuk artikel Anda.

Makin besar ukuran file dan resolusinya, daya muat blog akan semakin berat. Itulah perlunya meng-kompres gambar agar ukuran file jadi lebih ramping. Jangan buat blog Anda tersiksa, segera perkecil file gambar Anda.

Untuk caranya, silahkan menclok ke link artikel saya di bawah ini...gratis.


4. Minimalkan html template

Untuk membantu meringankan kerja loading, HTML template pun perlu diperkecil ukurannya. Banyak situs yang memberikan layanan gratis untuk merampingkan HTML. Salah satunya adalah HTML Compressor.

Selain mudah, hasil kompresinya akan tetap mempertahankan kode script asli pada template Anda. Mereka hanya ‘membuang’ kode-kode yang memang tidak dibutuhkan.

Perlu diingat, sebelum melakukan tips ini, backup dulu template Anda.

Berikutnya, buka alamat ini https://htmlcompressor.com lalu klik boks hijau bertuliskan “Start Using Now”. Dari edit html, gunakan ctrl+A lalu copy dan paste kan html template Anda pada kotak source di halaman HTML Compressor. Selanjutnya klik compress. Tunggu beberapa saat.

Setelah muncul hasil kompres, pilih select all, lalu paste kan ke html template Anda. Pratinjau template, jika tidak terjadi masalah simpan template.

Agar lebih yakin, coba cek URL homepage dan URL artikel ini pada pagespeed insight. Lihat skornya, ijo royo-royo bukan?

5. Pisahkan kode asinkron iklan pada css template (khusus blog adsense)

Tips ini khusus buat pemain Adsense blog. Tahukah Anda, iklan termasuk salah satu penyebab lambatnya tampilan loading halaman sebuah blog, tak terkecuali iklan Adsense.

Andai ada lebih dari satu iklan Adsense yang terpasang pada blog, mengakibatkan terjadinya pengulangan pada pembacaan kode asinkron. Ini bisa memperlambat daya muat loading. Tapi tenang, ada cara untuk menyiasatinya.

Secara umum, kode script iklan Adsense adalah seperti ini.

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- blog si kuya 300x250 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-xxxxxxxxxxx"
     data-ad-slot="xxxxxxxx"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Sengaja saya beri warna pada kode tersebut agar lebih mudah membedakannya. Untuk mempercepat loading iklan, prosesnya mirip dengan pemasangan kode jquery di atas.

Pisahkan kode asinkron iklan Adsense (tulisan warna biru) lalu tempatkan pada CSS template, tepatnya di bawah kode </b:skin>. Selanjutnya, saat memasang kode iklan lewat widget atau pun dalam postingan, cukup body iklan nya saja yang Anda pasang (tulisan warna merah).

Pemisahan ini tujuan nya agar saat proses loading, kode asinkron di load cukup sekali untuk semua iklan yang terpasang sehingga loading pun jadi lebih enteng.

6. Modifikasi css bundle blogger

Bagi Anda yang sering ngecek speed loading lewat pagespeed insight, dan kebetulan mendapat skor warna merah atau kuning, tentu tidak asing dengan warning ini “Eliminate render-blocking JavaScript and CSS in above-the-fold content”.

Peringatan itu memberitahu bahwa ada script di konten paruh atas pada template yang menghalangi proses render. Salah satu nya adalah css bundle blogger.

Solusinya cukup mudah. Cari kode <b:skin>….</b:skin> lalu letakkan kode di bawah ini sebelum kode <b:skin>.

&lt;style type=&quot;text/css&quot;&gt; &lt;!-- /*

Simpan template, dan cek kembali skor Anda.

7. Pasang widget seperlunya

Peran widget sangatlah penting. Sebagai blogger yang cerdas, Anda harus bisa menentukan apa saja widget yang mujarab untuk meningkatkan pageview.

Utamakan widget yang berfungsi sebagai navigasi untuk menggiring pengunjung agar mengklik artikel yang ada pada blog. Jangan pasang widget yang nggak penting bagi pembaca yang justru akan ‘menyiksa’ blog Anda.

Menurut saya, ada 3 widget yang wajib Anda pasang yaitu popular post, recent post, random post. Diluar ketiganya, saya anggap tidak terlalu penting.

Penutup


Harus Anda pahami, ngga semua pengunjung punya sifat penyabar. Blog yang super lemot, lebih besar peluang nya untuk ditinggalkan dan dilupakan.

Ada pepatah mengatakan “siapa cepat dia dapat”.  Jika ingin menarik banyak pengunjung blog, mulailah terapkan pepatah itu. Tampilkan halaman web Anda secepat mungkin sampai ke pengunjung.

Apakah loading blog Anda sudah ngebut? Beritahu saya lewat komentar Anda.

Semoga bermanfaat.

Akhir kata, SAY NO TO COPY PASTE. Wassalam.

______________________________ ARTIKEL TERKAIT ______________________________

28 komentar:

  1. Betul mas, saya sepakat. Blog ini adalah bukti relevansi artikel yg di buat mas teguh. Ngebut mas. Hehe Harus pasang cakram sepertinya. :D

    BalasHapus
    Balasan
    1. bisa aja mas Nino,.cakram sekarang mahal mas, mending pake tromol aja,..ha ha ha..

      yo wis,.matur nuwon udah mau mampir,..sukses terus

      Hapus
    2. Hahaha Oh ya mas. kode template di Blogger kok nggak bisa di copy semua ya? Jadi harus dikit2 gitu. Gmn cara nya biar bisa sekaligus di copy dan paste mas?

      Hapus
    3. mosok tho mas? udh coba pake ctrl+A belom biar template keblok semua,.trus tinggal di copy paste

      Hapus
  2. Izin bookmark Must Teguh...
    Informasi yang sangat bermanfaat...
    Terima kasih...

    BalasHapus
    Balasan
    1. silahkan saja kang Deddy,..tapi jangan kelamaan di bookmarknya,..ntar keburu basi,..he he he

      hatur nuhun kang

      Hapus
  3. OOT...
    Yang kotak di atas (ada keliatan tulisan loading) itu apa ya Mas...?

    BalasHapus
    Balasan
    1. itu boks slideshow kang,..kalo cuma muncul tulisan loading,.kemungkinan koneksi internetnya lagi lambat,.

      Hapus
    2. Owh... Slideshow...
      Maklum Mas... jaringan internet di kantor, dipakai rame-rame.. :D

      Hapus
  4. jadi cepat kayak kilat,, hehehehe..

    BalasHapus
    Balasan
    1. silahkan di coba mas Arief, ati-ati kesamber kilat,..ha haha

      thanks a lot

      Hapus
  5. mantap mas broo wuss langsung
    www.linkiganime,id

    BalasHapus
    Balasan
    1. sama2 mas Irga,..tapi sori, saya cuma visit doank nggak kasi komen, nggak ngerti dunia anime

      thanks,.salam blogger

      Hapus
  6. mantab mas teguh!
    oo ya, saya ada yg ragu, tanya mas teguh: utk perubahan kode iklan adsense itu apa gak berpengaruh pd kebijakan adsense soal perubahan kode iklan?
    atau ini bisa kita samakan saja dengan parse iklan yang jg merubah kode iklan?
    makasi mas!

    BalasHapus
    Balasan
    1. jangan khawatir mas Syafri,.itu aman

      kode hanya di pisahkan,.tidak dimodifikasi, menambah atau mengurangi,.
      saya pun pake cara itu, sampai sekarang aman terkendali,.

      ok mas? semoga tidak ragu2 lagi,.happy blogging

      Hapus
  7. Balasan
    1. saya juga lagi tahap belajar mba,..bareng yuuukk

      Hapus
  8. bermanfaat mas teguh. saya sudah ngacak" isi blog tapi gak bosen, karna loadingnya blog mas teguh super sekali. jadi gak ada waktu buat minum kopi sedikitpun
    hahahhaha sukses buat mas teguh

    BalasHapus
    Balasan
    1. makasih mas irfan udh ngacak2 mau blog saya he he he..

      sukses juga buat blognya sampean..salam blogger

      Hapus
  9. Terimakasih gan, atas informasinya.

    BalasHapus
    Balasan
    1. sama-sama mas Helmi,..silahkan dicoba

      Hapus
  10. Udah ngecek ke google page speed dan blog saya meraaah. Hiks hiks. Harus ikutin petunjuk mas teguh nih

    BalasHapus
    Balasan
    1. bisa ja kak Liza ini...wah blognya nambah satu lagi nih? sip deh moga ngga kalah yahuud sama yg pertama ya kak liza..

      thanks udh sudi mampir...salam

      Hapus
  11. Balasan
    1. heem mas Ikhsan,...tunggu update saya selanjutnya ya, artikel ini masih ada sambungannya lho

      Hapus
  12. boss minta pencerahannya, setelah ane compres html kok header 2 gak nampil yak, trus codenya berantakan, bikin puyeng liatnya....

    BalasHapus

Setiap komentar yang diterbitkan, saya pastikan blognya sudah tak kunjungi balik, dengan atau tanpa komentar yang saya sertakan.

Terima kasih atas kunjungannya. Wassalam