Họ đang đo gì
Bạn có hiểu cache là một hợp đồng về tính bất biến không, hay chỉ copy header từ Stack Overflow.
Trả lời ngắn~30 giây
JS có hash trong tên file: max-age=31536000, immutable — nội dung không bao giờ đổi dưới URL đó, nên cache mãi mãi là an toàn tuyệt đối và là toàn bộ lý do người ta hash tên file. HTML: no-cache — được lưu nhưng phải hỏi lại server mỗi lần, vì nó trỏ tới các file hash và một bản HTML cũ sẽ tải bundle cũ. Ảnh đại diện: max-age ngắn cộng ETag, hoặc thêm hash vào URL khi ảnh đổi.
Giải thích sâu
no-cache là cái tên gây hiểu nhầm nhất trong HTTP: nó KHÔNG có nghĩa “đừng lưu”, mà là “lưu đi, nhưng phải hỏi lại trước khi dùng”. Cái nghĩa mà người ta tưởng là no-store. Phân biệt được hai cái này là câu hỏi phụ rất hay xuất hiện, vì đặt nhầm no-store cho HTML khiến bạn mất luôn cơ hội trả 304 và tải lại toàn bộ trang mỗi lần.
immutable giải quyết một vấn đề cụ thể: không có nó, người dùng bấm nút tải lại sẽ khiến trình duyệt gửi request xác thực cho MỌI tài nguyên, kể cả những cái còn hạn — hàng chục request 304 vô ích. immutable nói với trình duyệt rằng đừng hỏi lại kể cả khi người dùng tải lại. Nó chỉ đúng khi URL thật sự bất biến, tức là khi tên file có hash nội dung.
Với CDN thì thêm s-maxage (chỉ CDN đọc) và stale-while-revalidate: CDN được phép trả bản cũ NGAY trong lúc lấy bản mới ở nền, nên người dùng không bao giờ chờ một lần cache miss. Đây là cách rẻ nhất để có độ trễ của trang tĩnh với nội dung cập nhật theo phút.
Câu hỏi tiếp theo họ sẽ hỏi
?ETag và Last-Modified khác gì?
ETag là một dấu vân tay của nội dung nên chính xác; Last-Modified chỉ có độ phân giải một giây và sai khi file được ghi lại với nội dung y hệt. Cả hai đều dẫn tới 304 — tiết kiệm băng thông chứ không tiết kiệm round-trip.
Trả lời thế này là mất điểm
- Đặt
max-agedài cho HTML. Người dùng sẽ kẹt ở bản cũ và bạn không có cách nào đẩy bản mới xuống.