Next.js 12.2, 엣지 런타임으로 성능 UP!
by DD
3년 전
조회수 6
Middleware 기능 안정화 및 API 개선, 요청 처리 전 코드 실행 지원
On-Demand ISR 도입으로 배포 없이 콘텐츠 업데이트 가능
Edge API Routes 및 Edge SSR 지원을 통해 엣지 환경 렌더링 성능 향상
미들웨어(Middleware)의 동작 원리
미들웨어는 요청 처리 전 실행되는 코드로, 요청 헤더 수정, 리다이렉션, 쿠키 설정 등을 수행한다. 구체적으로 `middleware.ts` 파일에서 `NextRequest`와 `NextResponse` 객체를 사용하여 요청을 가로챈다. 따라서 인증/인가 처리나 A/B 테스트 구현에 유용하다.
On-Demand ISR과 기존 ISR의 차이점
On-Demand ISR은 배포 없이 콘텐츠를 즉시 업데이트하는 기능이다. 기존 ISR은 빌드 시점에 정적 페이지를 생성하고, 일정 시간 간격으로 재 생성하는 방식이다. 반면 On-Demand ISR은 CMS 연동 시 데이터 변경을 감지하여 즉시 페이지를 갱신하므로, 데이터 일관성을 유지한다.
Edge 런타임의 장점과 고려 사항
Edge 런타임은 Node.js보다 가볍고 빠른 시작 시간을 제공하여 레이턴시 감소에 기여한다. 구체적으로 Edge API Routes와 Edge SSR을 지원하여 엣지 환경에서 렌더링을 수행한다. 하지만 Node.js API 미지원으로 인해, 기존 코드를 수정해야 하는 경우가 발생할 수 있다.
