Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / Blogger

Cara Mempercepat Loading Blog dengan DNS Prefetch

Lepiku.id
Cara Mempercepat Loading Blog dengan DNS Prefetch
Cara Mempercepat Loading Blog dengan DNS Prefetch. (Gambar: Lepiku.id)

Lepiku.id - Ada banyak cara yang bisa dilakukan untuk mempercepat loading blog, mulai dari mengurangi jumlah widget, memasang script lazy load, meng-compress JavaScript dan CSS, mengurangi jumlah iklan hingga memasang DNS Prefetch.

Disini saya tidak akan membahas tutorial tersebut satu per satu, melainkan hanya akan membahas cara mempercepat loading blog dengan memasang DNS Prefetch saja. 

Akan tetapi, jika memungkinkan akan saya buatkan juga trik mempercepat loading blog seperti yang sudah saya sebutkan diawal paragraf tadi.

Sebelum lanjut ke inti pembahasan, alangkah baiknya kamu memahami terlebih dahulu apa itu dns prefetch dan bagaimana cara kerjanya.

Apa Itu DNS Prefetch?

DNS Prefetch adalah sebuah fitur dari browser dimana secara background melakukan perubahan nama domain, misalnya saja dari lepiku,id menjadi ip address 127.0.0.1.

DNS Prefetch secara bandwidth pengaruhnya kecil, tapi secara latency pengaruhnya cukup besar apalagi di jaringan internet seluler.

Dengan menggunakan fitur DNS Prefetch, ketika pengunjung situs melakukan klik link maka latency yang terjadi menjadi lebih rendah. Dalam beberapa kasus, latency dapat menurun sampai satu detik.

Cara Kerja DNS Prefetch

DNS Prefetch akan memberikan perintah kepada browser untuk menyelesaikan perenderan nama domain secepat mungkin, kemudian untuk beberapa saat browser akan mengikatnya dan ketika pengunjung men-Scroll halaman blog, maka secara otomatis browser akan menampilkan halaman blog lebih cepat karena link eksternal dengan tag DNS Prefetch dianggap telah selesai dimuat.

Misalnya kamu memasang google font, maka penerapan tag dns prefetch nya seperti ini.

<link href='//fonts.googleapis.com' rel='dns-prefetch'/>

Bagaimana? ada sedikit gambaran? atau malah pusing? hehe. 

Tenang, kamu tidak perlu pusing-pusing kok! Kamu cukup ikuti saja panduan pemasangan script DNS Prefetch untuk mempercepat loading blog dibawah ini. 

Sebelumnya saya sangat berterima kasih kepada blog AdityaTekno.com karena sudah mengizinkan saya memposting script DNS Prefetch di blog Lepiku.id.

Perhatian!
Sebelum memasang script HTML DNS Prefetch, sebaiknya kamu cek terlebih dahulu apakah di template blog kamu sudah terpasang script HTML DNS Prefetch belum. Jika sudah, tidak perlu memasangnya lagi.

Cara Memasang Script DNS Prefetch di Blog

  1. Buka Dashboard Blogger.
  2. Pilih Menu Tema.
  3. Klik Edit HTML.
  4. Salin kode dibawah dan Tempelkan dibawah kode <head>.
    <link href='//ajax.googleapis.com' rel='dns-prefetch'/>
<link href='//www.google-analytics.com' rel='dns-prefetch'/>
<link href='//googleads.g.doubleclick.net' rel='dns-prefetch'/>
<link href='//www.googletagservices.com' rel='dns-prefetch'/>
<link href='//pagead2.googlesyndication.com' rel='dns-prefetch'/>
<link href='//maxcdn.bootstrapcdn.com' rel='dns-prefetch'/>
<link href='//adservice.google.ca' rel='dns-prefetch'/>
<link href='//adservice.google.com' rel='dns-prefetch'/>
<link href='//resources.blogblog.com' rel='dns-prefetch'/>
<link href='//fonts.googleapis.com' rel='dns-prefetch'/>
<link href='//1.bp.blogspot.com' rel='dns-prefetch'/>
<link href='//2.bp.blogspot.com' rel='dns-prefetch'/>
<link href='//3.bp.blogspot.com' rel='dns-prefetch'/>
<link href='//4.bp.blogspot.com' rel='dns-prefetch'/>
<link href='//disqus.com' rel='dns-prefetch'/>
<link href='//c.disquscdn.com' rel='dns-prefetch'/>
<link href='//github.com' rel='dns-prefetch'/>
<link href='//cdn.staticaly.com' rel='dns-prefetch'/>
<link href='//cdn.statically.io' rel='dns-prefetch'/>
<link href='//fontawesome.com' rel='dns-prefetch'/>
<link href='//www.sharethis.com' rel='dns-prefetch'/>
<link href='//cdn.jsdelivr.net' rel='dns-prefetch'/>
<link href='//rawcdn.githack.com' rel='dns-prefetch'/>
<link href='//images.dmca.com' rel='dns-prefetch'/>
  5. Klik Simpan Tema.

Jika terdapat link eksternal sumber lainnya di blog kamu, silahkan lakukan DNS Prefetch dengan format seperti pemasangan yang tadi dan tambahkan pada daftar dns prefetch diatas.

Atau bisa ikuti format DNS Prefetch seperti dibawah ini.

<link href='//url-external' rel='dns-prefetch'/>

Info: Ganti url-external dengan link eksternal lainnya yang ada pada blog kamu.

Baca Juga: Cara Mempercepat Loading Blog dengan Script Lazy Load

Sekian tutorial Cara Mempercepat Loading Blog dengan DNS Prefetch. Semoga bisa membantu permasalahan pada blog kamu. Terima kasih.

sumber:
https://www.adityatekno.com/2019/09/cara-mempercepat-loading-blog-dengan-dns-prefetch.html