Digital Transformation
ETag (Entity Tag)
TL;DR: ETag adalah header HTTP yang berisi sidik jari unik untuk versi sebuah file. Saat browser punya cache lama, ia kirim ETag tersebut ke server, dan server hanya merespons 304 Not Modified jika file belum berubah, sehingga halaman terbuka 100-400 ms lebih cepat tanpa download ulang.
Apa itu ETag?
ETag adalah header respons HTTP yang berisi string unik (umumnya hash dari isi file) untuk menandai versi spesifik sebuah resource. Saat resource diminta lagi, browser melampirkan ETag lama lewat header If-None-Match, dan server membandingkan: jika sama, balas 304 Not Modified tanpa body; jika beda, balas 200 OK dengan konten dan ETag baru.
Bedakan dengan Cache-Control. Cache-Control menentukan berapa lama browser boleh percaya cache tanpa cek ulang. ETag dipakai saat cache itu sudah jatuh tempo dan browser perlu validasi: apakah versi lama masih valid atau harus ganti.
Cara Kerja ETag
| Langkah | Aksi |
|---|---|
| 1 | Browser request gambar /hero.webp, server balas 200 OK + ETag: "abc123" |
| 2 | Browser simpan file + ETag di cache |
| 3 | Cache jatuh tempo, user buka halaman lagi |
| 4 | Browser kirim If-None-Match: "abc123" |
| 5a | File tidak berubah: server balas 304 Not Modified (0 byte body), browser pakai cache lokal |
| 5b | File berubah: server balas 200 OK + ETag baru + body baru |
Ada dua tipe: strong ETag (byte-identik) dan weak ETag (semantik sama, ditandai prefix W/). Sebagian besar CDN seperti Cloudflare dan Vercel pakai weak ETag karena lebih efisien.
Kenapa Penting?
Menghemat bandwidth dan mempercepat repeat visit. Untuk halaman product detail e-commerce dengan 30-50 asset (gambar, CSS, JS), ETag bisa pangkas 60-80% transfer pada kunjungan kedua. Dampaknya langsung ke LCP dan Core Web Vitals, terutama untuk pengguna 4G di Indonesia yang masih dominan.
Risiko: ETag yang dikonfigurasi salah (misal beda di server cluster) bikin cache miss berlebihan, justru menambah round-trip. Pastikan pakai hash deterministik dari konten file, bukan dari inode atau timestamp.
Pertanyaan Umum
Apakah ETag wajib jika sudah pakai Cache-Control?
Tidak wajib, tapi saling melengkapi. Cache-Control mencegah request, ETag memvalidasi saat request tetap terjadi. Kombinasi keduanya memberi perilaku cache paling efisien.
ETag atau Last-Modified, mana yang dipakai?
ETag lebih akurat karena pakai hash konten. Last-Modified pakai timestamp detik, bisa salah saat file berubah dalam detik yang sama. Browser modern memprioritaskan ETag jika keduanya ada.
Istilah Terkait