Next.js Cache Tags 도입을 통한 Static 성능 유지 및 데이터 실시간 정합성 확보

Context

Next.js App Router의 공격적인 Server-side Caching으로 인한 B2B SaaS 환경의 Stale Data 노출 문제 발생. 단순 no-store 설정 시 SSR 성능 저하와 Backend 부하 증가라는 Trade-off 직면.

Technical Solution

• Fetch 요청 단계에서 tenant-profile-${tenantId}와 같은 고유 식별자 기반의 Cache Tag 부여
• 데이터 변조 발생 시 Server Action 내에서 revalidateTag 함수를 호출하는 Surgical Invalidation 구조 설계
• 전체 캐시 삭제가 아닌 특정 태그만 선택적으로 Purge 하여 불필요한 재검색 방지
• Cached Layout 유지와 Purged Data의 최신성 확보를 통한 하이브리드 렌더링 전략 구현
• Database Mutation 직후 즉각적인 Cache Invalidation을 통한 Backend 상태와 UI의 동기화