Sebuah situs dapat berubah di server sementara satu browser masih menampilkan gambar, script, atau respons halaman versi lama. Membuka alamat yang sama di browser lain mungkin langsung menampilkan versi baru. Perbedaan ini sering berasal dari HTTP cache browser, yang dapat menggunakan kembali respons tersimpan alih-alih mengunduh byte yang sama lagi.
Cache browser bukan sekadar folder berisi file yang ada atau tidak ada. HTTP memberi respons tersimpan state freshness dan menyediakan validator untuk memeriksa apakah konten tersimpan masih cocok dengan server. Aturan tersebut menentukan kapan reuse menghindari transfer jaringan dan kapan browser harus menghubungi server kembali.
Isi yang disimpan cache browser
Saat browser meminta resource web, server mengembalikan respons HTTP. Bergantung pada header respons dan aturan HTTP caching, browser dapat menyimpan respons tersebut untuk penggunaan berikutnya. Gambar, style sheet, script, font, dan respons dokumen semuanya dapat bersifat cacheable.
Permintaan berikutnya untuk resource yang sama dapat dipenuhi dari respons tersimpan jika respons tersebut masih dianggap fresh. Hal ini dapat mengurangi traffic jaringan dan menghindari transfer konten yang sudah dimiliki browser.
Cache bekerja dengan URL resource dan metadata HTTP. Cache tidak memeriksa halaman lalu memutuskan bahwa dua URL berbeda berisi file yang setara. Karena itu, situs yang mengubah URL asset ketika asset berubah dapat mempertahankan versi lama dalam cache untuk waktu lama tanpa membuat versi baru bersaing dengan entri cache lama.
Fresh dan stale merupakan state HTTP
Respons tersimpan dapat memiliki freshness lifetime. Salah satu directive server yang umum adalah Cache-Control: max-age=N, dengan N menyatakan jumlah detik respons dapat tetap fresh setelah dibuat, mengikuti perhitungan age HTTP.
Selama respons masih fresh, cache biasanya dapat menggunakannya kembali tanpa menghubungi origin server. Setelah freshness lifetime terlewati, respons menjadi stale. Stale tidak berarti byte tersimpan langsung dihapus. Cache dapat mempertahankannya karena respons tersebut masih berguna setelah validasi.
Perbedaan ini menjelaskan sumber kebingungan yang umum. Sebuah file dapat tetap berada secara fisik di cache meskipun aturan HTTP tidak lagi mengizinkan reuse biasa sebagai respons fresh.
Validasi dapat mempertahankan salinan tersimpan
Respons cache yang stale tidak selalu mengharuskan seluruh resource diunduh lagi. Server dapat menyediakan validator seperti ETag atau Last-Modified.
ETag mengidentifikasi versi tertentu dari sebuah resource. Ketika browser memiliki respons tersimpan dengan ETag, browser dapat mengirim conditional request menggunakan If-None-Match. Jika server menentukan representasi belum berubah, server dapat mengembalikan 304 Not Modified. Browser kemudian tetap memakai body respons tersimpan tanpa menerima body tersebut lagi.
Last-Modified dapat mendukung pemeriksaan serupa melalui If-Modified-Since. Nilainya merepresentasikan waktu ketika origin server menganggap resource terakhir diubah. ETag dapat membedakan versi resource tanpa hanya bergantung pada waktu modifikasi.
Validasi tetap melibatkan pertukaran jaringan, tetapi dapat menghindari pengiriman ulang seluruh konten.
no-cache bukan berarti tidak disimpan
Nama directive no-cache mudah disalahartikan. Dalam respons HTTP, Cache-Control: no-cache mengizinkan penyimpanan tetapi mewajibkan validasi sebelum respons tersimpan digunakan kembali berdasarkan aturan cache normal.
Cache-Control: no-store memiliki tujuan berbeda: directive ini meminta cache agar tidak menyimpan respons. Keduanya tidak dapat dipertukarkan.
Perbedaan ini penting ketika mendiagnosis situs yang tampak kedaluwarsa. Adanya no-cache tidak berarti browser tidak memiliki salinan tersimpan. Artinya, reuse terikat pada validasi. Jika server memberikan hasil validasi yang berhasil, browser dapat terus memakai body yang sudah dimilikinya.
Reload dan force reload merupakan permintaan berbeda
Reload browser biasa umumnya meminta cache memvalidasi respons tersimpan. Jika resource belum berubah, validasi masih dapat berakhir dengan penggunaan kembali body dari cache.
Force reload lebih agresif. Browser utama dapat melewati respons cache untuk permintaan reload tersebut dan meminta konten dari server lagi. Shortcut antarmuka pengguna dan sebagian detail request berbeda antarbrowser, sehingga force reload lebih tepat dipandang sebagai tindakan browser tersendiri daripada satu kombinasi keyboard universal.
Kedua tindakan tersebut tidak mengubah kebijakan caching yang dipilih situs untuk kunjungan berikutnya. Setelah respons fresh diterima, header respons kembali menentukan bagaimana respons tersebut boleh disimpan dan digunakan kembali.
Cache browser terpisah dari snapshot halaman
Tidak setiap perpindahan instan kembali ke sebuah halaman merupakan reuse HTTP cache biasa. Browser dapat mempertahankan back-forward cache, yang sering disebut bfcache, untuk menyimpan snapshot halaman bagi navigasi riwayat. Kembali dengan tombol Back atau Forward dapat memulihkan snapshot tersebut tanpa aktivitas jaringan yang sama seperti navigasi baru.
Perbedaan ini dapat membuat halaman tampak tidak berubah meskipun respons HTTP-nya memakai aturan validasi. Pemulihan riwayat dan HTTP response caching menyelesaikan masalah yang berbeda; membersihkan atau melewati salah satunya tidak berarti mekanisme lain akan berperilaku sama.
Konten lama juga dapat berasal dari lapisan lain
Halaman yang tampak stale bukan bukti bahwa cache browser lokal adalah penyebabnya. Shared cache, content delivery network, service worker, data aplikasi, dan sistem sisi server semuanya dapat memengaruhi representasi yang akhirnya tampil di layar.
Service worker sangat relevan karena situs dapat memprogramnya untuk mencegat request dan menerapkan strategi caching sendiri. Dalam kondisi tersebut, HTTP cache biasa milik browser hanya menjadi salah satu bagian jalur request.
Karena alasan yang sama, menghapus seluruh data browser merupakan respons yang luas untuk gejala yang sempit. Jika hanya satu resource yang kedaluwarsa, perbedaan yang lebih berguna adalah apakah browser menggunakan ulang respons HTTP fresh, memvalidasi respons stale, memulihkan snapshot halaman, atau menerima konten lama dari lapisan lain.
Browser caching bekerja paling baik ketika situs memberi resource yang sering berubah aturan validasi yang sesuai dan memberi asset statis berversi aturan cache stabil dengan masa simpan panjang. Bagi pengguna, batas praktisnya lebih sederhana: force reload dapat menguji apakah respons cache biasa terlibat, tetapi konten lama yang terus muncul dapat menunjukkan lapisan cache lain atau situs itu sendiri.