Cara Meningkatkan Kecepatan Loading Blog dengan DNS Prefetch - Bagi sebagian penulis blog, DNS Prefetch mungkin masih menjadi istilah yang sangat asing. Namun sadar atau tidak, template yang digunakan ternyata sering menggunakan jenis atribut tersebut.
Untuk membuktikannya, coba cek template yang Anda gunakan, apakah telah terpasang ..rel="dns-prefetch".. atau tidak? Jika belum ada, baca sampai habis yok!
DNS Prefetch sejatinya digunakan untuk menekan waktu pemuatan sebuah halaman website menjadi lebih cepat. Siapa sih yang tak kesal dengan loading yang super lama dan lemot?
Jika waktu pemuatan yang lama dibiarkan begitu saja, tentu banyak kerugian yang bisa diakibatkan. Efeknya bisa saja seperti peringkat artikel yang semakin menurun dan meningkatkan persentase bounce rate dari waktu ke waktu.
Untuk mencegah efek negatif tersebut, sangat perlu adanya solusi yang bisa digunakan untuk menekan waktu pemuatan. Intinya, semakin cepat waktu loading, semakin baik pula reputasi blog atau situs di mata pengunjung dan mesin pencari.
Faktor yang Dapat Memperlambat Loading Blog
Sebenarnya, banyak sekali faktor yang dapat mempengaruhi kecepatan akses sebuah blog. Faktor tersebut diantaranya:
- Kualitas jaringan yang buruk
- Web server yang sedang down
- Widget atau plugin yang belebihan
- Penggunaan JavaScript
- Penggunaan script CSS yang terlalu berlebihan di halaman tulisan
- Ukuran file pendukung yang besar
- Pemasangan iklan
- Perangkat yang digunakan terjangkit virus atau malware.
Silahkan melakukan analisa terlebih dahulu dengan mengecek langsung kecepatan blog Anda di situs PageSpeed Insights atau GTmetrix. Setelah itu, lakukan perbaikan dengan mengacu pada jenis masalah yang Anda dapatkan di situs tadi.
Pengertian dan Definisi DNS Prefetch
DNS Prefetch atau Domain Name System Prefetching adalah salah satu fitur yang disediakan oleh browser dalam menjalankan proses rendering pada nama domain ke IP address.
Menurut kebanyakan web designer, DNS Prefetch menjadi salah satu solusi yang paling banyak digunakan saat ini. Hal tersebut bukan tanpa alasan tentunya, melainkan karena penggunaannya yang telah didukung di semua jenis browser saat ini, baik itu di perangkat mobile maupun desktop.
Cara Kerja DNS Prefetch
Pada dasarnya, browser akan memuat link atau tautan terlebih dahulu berdasarkan IP address untuk disimpan ke dalam cache. Setelah proses penyimpanan selesai, browser tidak perlu lagi merender link atau tautan pada saat halaman tersebut dikunjungi.
Karena resource link telah disimpan ke dalam cache, pengunjung bisa menghemat waktu sepersekian atau sekitar 200 milidetik setiap kunjungan.
Dengan cara kerja yang seperti itu, DNS Prefetch bisa dikatakan mirip-mirip dengan Google AMP.
Cara Penerapan DNS Prefetch
- Masuk ke BLOGGER
- Pilih menu TEMA
- Pilih EDIT HTML
- Tempel di antara <head> - </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="//github.com" rel="dns-prefetch"/>
<link href="//cdn.rawgit.com" 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="//www.histats.com" rel="dns-prefetch"/>Anda bisa menambahkan kode di atas dengan link eksternal lainnya (pastikan format penulisan sama).
Catatan
- Cek terlebih dahulu template yang Anda gunakan, apakah salah satu kode di atas sudah terpasang atau tidak. Jangan sampai terjadi bentrok antar kode
- Gunakan kode di atas sesuai dengan kebutuhan (hapus yang tidak dibutuhkan).
Penutup
Setelah melakukan proses pemasangan dan penerapan, silahkan lakukan pengecekan untuk mengetahui apakah link bekerja dengan baik atau tidak.
Jika hasil yang ada tidak cukup memuaskan, Anda juga bisa melakukan solusi yang lain yaitu Cloudflare.
Cukup sekian artikel tentang Cara Meningkatkan Kecepatan Loading Blog dengan DNS Prefetch ini, Terima kasih.