Vercel CDN이 응답 헤더에 태그를 붙이면 이후 해당 태그로 한꺼번에 캐시를 무효화할 수 있는 태그 기반 캐시 무효화 기능을 모든 요금제에 출시했다. Next.js ISR 내부에서만 쓰이던 캐시 태그 메커니즘을 CDN 응답 헤더로 노출해 모든 프레임워크와 언어에서 활용할 수 있게 됐다.
핵심 포인트- 응답에 `Vercel-Cache-Tag: tag1,tag2` 헤더를 추가하면 Vercel CDN이 해당 태그로 콘텐츠를 그룹화한다.
- 이후 tag 이름 하나로 해당 태그가 붙은 모든 캐시 엔트리를 한 번에 무효화할 수 있다.
- 기존 `Cache-Control`, `CDN-Cache-Control`, `Vercel-CDN-Cache-Control` 헤더 스택과 함께 동작한다.
- 무효화 방법은 대시보드, Vercel CLI, `invalidateByTag()` 함수, REST API 네 가지를 지원한다.
- Next.js ISR이 내부적으로 쓰던 캐시 태그 기술이 일반 HTTP 응답으로 공개된 것 — 프레임워크 무관하게 사용 가능.
상세 정리- 배경: URL 단위 캐시 무효화는 관련 콘텐츠 전체를 무효화하기 어렵다 — 상품 데이터 변경 시 상품 페이지·검색 결과·카테고리 페이지를 각각 퍼지해야 했다.
- 태그 매핑 방식: 응답마다 `Vercel-Cache-Tag: product-123,category-electronics`처럼 쉼표로 구분된 태그를 헤더에 붙인다. CDN이 이를 색인화해 태그→캐시 엔트리 역매핑을 유지한다.
- 헤더 스택 통합: 기존 캐시 제어 헤더(`Cache-Control`, `CDN-Cache-Control`, `Vercel-CDN-Cache-Control`)와 독립적으로 동작 — 기존 캐싱 전략을 유지하면서 태그만 추가할 수 있다.
- Next.js ISR 연결: Next.js가 `revalidateTag('product-123')` 호출 시 사용하는 내부 메커니즘과 동일한 인프라 — Next.js 없이 동일 기능을 직접 HTTP 헤더로 구현 가능하게 됐다.
- 무효화 API: (1) Vercel 대시보드 수동 퍼지, (2) `vercel cache invalidate --tag product-123` CLI, (3) 서버 함수에서 `invalidateByTag('product-123')`, (4) REST API로 엣지 캐시 엔드포인트 호출.
- 가용성: 추가 비용 없이 모든 요금제에서 즉시 사용 가능.
왜 읽나상품·사용자·콘텐츠 단위 캐시를 세밀하게 제어해야 하는 백엔드/인프라 엔지니어에게 CDN 레이어 캐시 무효화 패턴의 실용적 레퍼런스.