Caching dan CDN untuk Pemula: Panduan Cloudflare
Caching berarti menyimpan salinan data agar tidak perlu dibuat atau diambil ulang setiap kali dibutuhkan. Di dunia website, caching adalah salah satu cara paling efektif untuk mempercepat halaman dan meringankan beban server. CDN (Content Delivery Network) membawa ide itu lebih jauh dengan menyimpan salinan di banyak lokasi di dunia.
Tiga lapisan cache
1. Cache browser
Saat pengunjung membuka website, browser menyimpan file seperti gambar, CSS, dan JavaScript. Pada kunjungan berikutnya, file yang masih berlaku tidak diunduh ulang. Masa berlakunya diatur oleh header HTTP Cache-Control yang dikirim server:
Cache-Control: public, max-age=31536000, immutable
Contoh di atas berarti file boleh disimpan selama satu tahun. Ini aman untuk file yang namanya berubah setiap kali isinya berubah, misalnya app.3f9a1c.js atau style.css?v=12. Untuk halaman HTML yang sering berubah, gunakan masa simpan pendek atau no-cache agar browser selalu memeriksa versi terbaru.
2. Cache server (cache halaman)
Pada website dinamis seperti WordPress, setiap halaman dibuat oleh PHP dan database. Cache halaman menyimpan hasil HTML-nya, sehingga kunjungan berikutnya dilayani langsung tanpa menjalankan PHP. Ini menurunkan TTFB secara signifikan. Di WordPress, cache halaman diaktifkan dengan plugin seperti LiteSpeed Cache atau WP Super Cache. Di server sendiri, bisa memakai fitur cache di Nginx, Varnish, atau sejenisnya.
Ada juga object cache seperti Redis atau Memcached yang menyimpan hasil kueri database. Ini berguna untuk halaman yang tidak bisa di-cache penuh, misalnya keranjang belanja atau dasbor anggota.
3. Cache CDN
CDN adalah jaringan server di banyak kota. Pengunjung dari Jakarta mengambil file dari server CDN terdekat, bukan dari server asal yang mungkin berada di negara lain. Hasilnya, waktu tempuh data lebih pendek dan server asal menerima lebih sedikit permintaan.
Mengapa Cloudflare populer
Cloudflare menyediakan paket gratis yang mencakup CDN, sertifikat SSL, perlindungan dasar terhadap serangan DDoS, dan pengaturan DNS. Cloudflare memiliki pusat data di banyak kota, termasuk di Indonesia. Untuk website kecil dan menengah, paket gratis sering sudah cukup.
Langkah dasar memasang Cloudflare
- Daftar di cloudflare.com dan tambahkan domain Anda.
- Cloudflare akan memindai catatan DNS yang ada. Periksa apakah semuanya benar, terutama catatan A untuk website dan MX untuk email.
- Ganti nameserver domain di tempat Anda membeli domain dengan dua nameserver yang diberikan Cloudflare. Proses ini bisa memakan waktu beberapa menit hingga 24 jam.
- Pastikan catatan DNS untuk website berstatus Proxied (ikon awan oranye). Catatan untuk email harus DNS only.
- Atur SSL/TLS ke mode Full (strict) jika server Anda sudah memiliki sertifikat yang valid. Jangan memakai mode Flexible untuk jangka panjang, karena koneksi antara Cloudflare dan server Anda tidak terenkripsi. Lihat HTTPS dan SSL.
Pengaturan yang disarankan
- Brotli: Cloudflare mengompres konten untuk pengunjung secara otomatis.
- Browser Cache TTL: biarkan "Respect Existing Headers" jika server Anda sudah mengatur
Cache-Controldengan benar. - Always Use HTTPS: aktifkan agar semua akses HTTP dialihkan ke HTTPS.
- Caching Level: Standard sudah cukup untuk sebagian besar website.
Secara bawaan, Cloudflare hanya menyimpan file statis seperti gambar, CSS, dan JS, bukan halaman HTML. Untuk menyimpan HTML di CDN, Anda perlu membuat Cache Rules. Ini bisa sangat mempercepat website, tetapi harus hati-hati.
Hati-hati dengan halaman dinamis
Jangan pernah meng-cache halaman yang isinya berbeda untuk setiap pengguna, seperti:
- Halaman login, dasbor admin (
/wp-admin), dan akun pengguna. - Keranjang belanja dan checkout.
- Halaman yang menampilkan nama atau data pribadi pengguna.
Jika halaman seperti ini ter-cache, pengunjung lain bisa melihat data yang bukan miliknya. Saat membuat aturan cache HTML, kecualikan path tersebut dan lewati cache jika ada cookie login atau sesi. Plugin resmi Cloudflare untuk WordPress dan fitur APO (berbayar) menangani hal ini secara otomatis.
Membersihkan cache (purge)
Setelah mengubah CSS, mengganti gambar, atau memperbarui tema, pengunjung mungkin masih melihat versi lama dari cache. Solusinya:
- Purge cache di dasbor Cloudflare (bisa semua file atau URL tertentu).
- Kosongkan cache plugin di WordPress.
- Gunakan nama file berversi (
style.css?v=13) agar browser otomatis mengambil yang baru.
Cara memeriksa apakah cache bekerja
Buka DevTools di Chrome (F12), pilih tab Network, muat ulang halaman, lalu klik sebuah file. Di bagian header respons:
cf-cache-status: HITberarti file dilayani dari cache Cloudflare.MISSberarti belum ada di cache; coba muat ulang.DYNAMICberarti Cloudflare tidak meng-cache file tersebut, biasanya HTML.
Periksa juga header Cache-Control untuk melihat berapa lama browser boleh menyimpannya.
Dampak pada hasil tes
Setelah caching dan CDN aktif, biasanya TTFB turun dan file statis dimuat lebih cepat. Uji ulang di webmaster.my.id beberapa kali, karena tes pertama setelah purge bisa lebih lambat saat cache sedang diisi ulang. Hasil di Hasil Tes akan menunjukkan perkembangannya.
Contoh pengaturan untuk blog dan toko online
Blog atau company profile. Hampir semua halaman sama untuk setiap pengunjung. Aktifkan cache halaman di server, biarkan Cloudflare menyimpan file statis, dan atur cache browser untuk gambar, CSS, dan JavaScript selama berminggu-minggu atau berbulan-bulan dengan nama file berversi. Setelah menerbitkan artikel baru, cukup bersihkan cache halaman yang berubah.
Toko online. Halaman produk dan kategori bisa disimpan di cache, tetapi keranjang, checkout, akun, dan halaman yang memuat data pribadi harus dikecualikan. Pastikan aturan cache di Cloudflare tidak menyimpan halaman yang memiliki cookie login atau keranjang.
Checklist caching
- File statis memiliki header
Cache-Controldengan masa simpan panjang. - Nama file CSS dan JavaScript berubah setiap kali isinya berubah, misalnya
style.css?v=5. - Cache halaman aktif untuk pengunjung yang tidak login.
- Halaman dinamis seperti keranjang, checkout, dan dasbor dikecualikan.
- Mode SSL Cloudflare diatur ke Full (strict) jika server sudah punya sertifikat valid.
- Header
cf-cache-statusdiperiksa untuk memastikan file statis menunjukkan HIT. - Ada prosedur purge setelah memperbarui konten atau desain.
Kesalahan umum
- Menyimpan semua halaman di cache CDN tanpa pengecualian. Pengunjung bisa melihat halaman akun atau keranjang orang lain. Ini masalah keamanan serius.
- Memakai mode SSL Flexible. Koneksi dari Cloudflare ke server tidak terenkripsi dan sering menyebabkan pengalihan berulang.
- Mengira purge membuat situs lambat permanen. Setelah purge, permintaan pertama memang lebih lambat, tetapi cache terisi kembali dengan cepat.
- Menumpuk banyak lapisan optimasi yang sama. Minify di plugin dan di CDN sekaligus jarang memberi manfaat tambahan dan bisa menyulitkan pencarian masalah.
Pertanyaan yang sering diajukan
Apakah Cloudflare gratis cukup untuk website kecil?
Untuk sebagian besar website kecil dan menengah, paket gratis sudah menyediakan CDN, SSL, dan perlindungan dasar yang memadai.
Kenapa halaman HTML saya selalu DYNAMIC di Cloudflare?
Secara bawaan Cloudflare hanya menyimpan file statis berdasarkan ekstensinya, bukan halaman HTML. Untuk menyimpan HTML, Anda perlu membuat aturan cache khusus dan memastikan halaman dinamis dikecualikan.
Berapa lama sebaiknya cache browser?
Untuk file berversi seperti CSS, JavaScript, dan gambar yang jarang berubah, satu bulan hingga satu tahun adalah hal umum. Untuk HTML, gunakan waktu singkat atau validasi ulang agar konten baru cepat terlihat.
Apakah cache memengaruhi hasil tes webmaster.my.id?
Ya. Halaman yang diambil dari cache biasanya punya TTFB lebih rendah. Uji beberapa kali agar cache sempat terisi dan hasilnya mencerminkan pengalaman pengunjung biasa.
Apa arti status HIT, MISS, dan BYPASS di Cloudflare?
HIT berarti file diambil dari cache Cloudflare, MISS berarti belum ada di cache sehingga diambil dari server asal, dan BYPASS berarti aturan atau cookie membuat permintaan itu sengaja tidak disimpan di cache.
Apakah perlu plugin cache jika sudah memakai Cloudflare?
Biasanya tetap perlu. Cloudflare secara bawaan menyimpan file statis, sedangkan plugin atau cache server mempercepat pembuatan halaman HTML di server asal. Keduanya bekerja di lapisan berbeda.
Ringkasan
- Atur
Cache-Controlyang panjang untuk file statis berversi. - Aktifkan cache halaman di server atau plugin.
- Gunakan CDN seperti Cloudflare dengan SSL Full (strict).
- Jangan pernah meng-cache halaman pribadi atau checkout.
- Purge cache setelah melakukan perubahan.
Caching yang benar membuat website lebih cepat bagi pengunjung sekaligus menghemat sumber daya server.