page에서 끝낼 일과 클라이언트로 넘길 일을 분리해야 번들이 작아진다
페이지 컴포넌트는 기본 서버 컴포넌트이므로 데이터 조회와 정적 렌더는 서버에서 끝내고, 이벤트가 필요한 부분만 작은 클라이언트 컴포넌트로 분리한다.
| 작업 | page.tsx에 둔다 | 클라이언트로 분리한다 | 판단 기준 |
|---|---|---|---|
| 데이터 조회 | DB/API fetch, 파일 읽기 | 브라우저 전용 API가 필요할 때만 | 비밀 값이 필요한가 |
| 목록 렌더 | 초기 HTML 목록 출력 | 검색 입력, 정렬 토글 | 이벤트 핸들러가 있는가 |
| 상세 조회 | params await 후 id 검증 | 좋아요 버튼, 공유 버튼 | 상태 변경이 필요한가 |
| 오류 처리 | throw, notFound | reset 버튼이 있는 error.tsx | 사용자 재시도가 필요한가 |
| 스타일/구조 | layout과 page에서 정적 구조 | 드래그, 모달, 애니메이션 | 상호작용이 핵심인가 |