중고나라 기술 블로그 · 2026. 03. 04.

웹 서버가 터졌다: Next.js SSR에서 TanStack Query gcTime이 만든 OOM

AI 엔지니어링 브리핑

Next.js App Router와 TanStack Query를 함께 사용하던 중, 서버 요청에 쌓인 캐시가 오래 남아 메모리 부족(OOM)을 일으킨 원인과 해결 방향을 설명한 글입니다.

문제 & 배경

문제 & 배경: 요청마다 공유하던 QueryClient에 GNB·검색·상품 데이터가 함께 쌓였고, GNB 캐시의 긴 gcTime(1시간) 때문에 요청이 끝난 뒤에도 QueryClient를 참조하는 클로저가 남아 메모리가 계속 증가했습니다.

기술 & 해결책

기술 & 해결책: React.cache()로 요청 안에서 QueryClient를 공유하고 서버에서 데이터를 미리 받아 전달하는 구조를 사용했는데, 캐시 보관 시간을 길게 설정한 QueryClient가 가비지 컬렉션 대상이 되지 못하면서 발생한 메모리 누수를 추적했습니다.

교훈 & 주의점

교훈 & 주의점: 캐시를 오래 유지하면 성능에는 도움이 될 수 있지만 서버 메모리를 붙잡을 수 있으므로, App Router의 요청 범위와 QueryClient 공유 방식, 특히 gcTime 설정이 서버 환경에서 안전한지 함께 점검해야 합니다.

내용이 비슷해요

내용이 비슷한 글을 먼저 보여드려요. 같은 문제나 해결책을 다룬다는 뜻은 아니에요.