Next.js 16.2 완전 정리 — Turbopack 완성, Server Fast Refresh, AI-Native 개발 | 기술노트

들어가며

2026년 3월 18일, Next.js 16.2가 공식 릴리스되었습니다. 이번 릴리스의 핵심은 단연 Turbopack의 완성입니다. 2022년 Next.js 13에서 처음 발표된 이후 3년 반의 개발 끝에, Turbopack이 마침내 webpack을 완전히 대체하는 수준에 도달했습니다.

1. Turbopack — 3년 반의 결실

성능 수치

next dev 시작 속도: 400% 향상 (webpack 대비)
페이지 렌더링: 50% 빠름
HMR(Hot Module Replacement): 거의 즉시 (대규모 프로젝트에서도 100ms 이내)

왜 이렇게 빠른가

Turbopack은 Rust로 작성되었지만, 단순히 "Rust라서 빠르다"가 아닙니다:

증분 컴파일(Incremental Compilation): 변경된 모듈만 재컴파일. 의존성 그래프를 세밀하게 추적하여 불필요한 작업을 완전히 제거
병렬 처리: CPU 코어 수에 비례하여 빌드 속도 향상. 8코어 머신에서 webpack 대비 8배 빠른 이유
영속 캐시(Persistent Cache): 디스크에 컴파일 결과를 캐싱. 두 번째 시작부터는 거의 즉시 로드
지연 컴파일(Lazy Compilation): 요청된 페이지만 컴파일. 100개 페이지 프로젝트에서도 첫 페이지 로드는 1개 페이지 프로젝트와 동일한 속도

마이그레이션

# next.config.js에서 별도 설정 불필요
# Next.js 16.2부터 Turbopack이 기본값
# webpack으로 폴백하려면:
/** @type {import('next').NextConfig} */
const nextConfig = {
  bundler: 'webpack', // 명시적으로 webpack 지정 시에만
}

2. Server Fast Refresh

이전까지 HMR은 클라이언트 컴포넌트에서만 동작했습니다. 서버 컴포넌트를 수정하면 전체 페이지가 리로드되었습니다.

16.2의 Server Fast Refresh는 서버 컴포넌트에서도 클라이언트 HMR과 동일한 수준의 핫 리로딩을 제공합니다:

서버 컴포넌트 수정 시 해당 컴포넌트만 서버에서 재렌더링
클라이언트 상태(state, scroll position 등) 완전 보존
DB 쿼리, API 호출 등 서버 사이드 로직 변경도 즉시 반영
체감 속도: 서버 컴포넌트 수정 후 200ms 이내 반영

3. AGENTS.md — AI 에이전트 시대의 개발 환경

create-next-app으로 프로젝트를 생성하면 이제 AGENTS.md 파일이 자동으로 포함됩니다. 이 파일은 Claude Code, GitHub Copilot Workspace, Cursor 같은 AI 에이전트가 프로젝트의 구조와 컨벤션을 이해하는 데 사용됩니다.

# AGENTS.md 예시
## Project Structure
- app/ — App Router pages and layouts
- components/ — Reusable React components
- lib/ — Utility functions and configurations

## Conventions
- Use Server Components by default
- Client Components only when useState/useEffect needed
- Prisma for database access
- Tailwind CSS for styling

4. Subresource Integrity (SRI)

빌드된 JavaScript 파일에 대한 무결성 검증 해시가 자동으로 추가됩니다:

<script
  src="/_next/static/chunks/app.js"
  integrity="sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8w"
  crossorigin="anonymous"
/>

CDN이 해킹되거나 중간자 공격이 발생해도, 변조된 스크립트는 브라우저가 실행을 거부합니다.

5. 기타 주요 변경사항

Web Worker Origin 지원: WASM 라이브러리를 Worker에서 직접 사용 가능
next-browser (experimental): 브라우저 콘솔 로그를 서버 터미널로 포워딩
동적 import tree-shaking: 동적으로 import된 모듈에서도 사용하지 않는 코드 제거
200개 이상의 버그 수정
보안 패치: Request smuggling 관련 CVE 수정

15.x에서 마이그레이션

# 패키지 업데이트
npm install next@16.2 react@19 react-dom@19

# 주요 확인사항
# 1. next.config.js → next.config.ts 권장 (TypeScript 지원 강화)
# 2. turbopack이 기본값이므로 webpack 플러그인 사용 시 확인 필요
# 3. middleware.ts 시그니처 변경 없음
# 4. App Router API 변경 없음 (하위 호환)

마무리

Next.js 16.2는 개발 경험(DX)의 결정적 전환점입니다. Turbopack의 완성으로 대규모 프로젝트에서도 즉각적인 피드백 루프가 가능해졌고, Server Fast Refresh로 풀스택 개발의 편의성이 한 단계 올라갔습니다. AGENTS.md는 AI와 협업하는 개발 환경의 표준이 될 것으로 보입니다.