레이아웃 파일 위치는 적용 범위와 런타임 경계를 동시에 결정한다
파일을 한 단계 위로 올리면 더 많은 페이지가 영향을 받고, use client를 위에 두면 더 넓은 영역이 브라우저 번들로 간다.
| 결정할 것 | 권장 위치 | 좋은 신호 | 나쁜 신호 |
|---|---|---|---|
| 전체 공통 UI | src/app/layout.tsx | 모든 페이지에 필요한 header/footer | 특정 섹션 메뉴까지 root에 둠 |
| 섹션 공통 UI | src/app/dashboard/layout.tsx | 대시보드 안에서만 sidebar 유지 | about에도 대시보드 메뉴가 보임 |
| 상호작용 메뉴 | layout 안의 작은 client component | 상태 필요한 부분만 use client | layout.tsx 전체를 client로 전환 |
| 페이지 고유 데이터 | 각 page.tsx | 화면별 fetch 범위가 작음 | layout fetch가 모든 하위 화면을 지연 |
| 오류/로딩 처리 | 가장 가까운 세그먼트 파일 | 문제 영역만 대체 UI로 감쌈 | 앱 전체가 오류 화면으로 덮임 |