AFTER

06. 브라우저 캐시 (Cache-Control)

이 asset.js는 Cache-Control: public, max-age=31536000, immutable로 서빙됩니다. 이 페이지를 새로고침(F5)해서 "재방문" 행을 확인해 보세요. 디스크/메모리 캐시에서 바로 읽기 때문에 전송 크기(transferSize)가 0에 가깝게 떨어집니다.
📍 이 측정은 당신이 지금 쓰는 브라우저에서 실행됩니다.

Before (no-store) After (max-age=1년)

⏳ 로드 대기 중...

🔧 실제 구현 코드

// routes/labs/browser-cache.js
router.get("/after/asset.js", function (req, res) {
  res.set("Cache-Control", "public, max-age=31536000, immutable");
  res.type("application/javascript");
  res.sendFile(ASSET);
});

max-age=31536000(1년)과 immutable은 "이 자산은 만료 전까지 절대 바뀌지 않으니 네트워크 요청 없이 디스크/메모리 캐시에서 바로 써도 된다"는 지시입니다. 재방문 (새로고침) 시 transferSize가 0에 가깝게 떨어지는 이유입니다.

← 실습 목록으로 돌아가기