로딩 화면은 route 범위, fallback 모양, 대체 시점을 함께 설계한다
loading.tsx를 추가할 때는 파일 위치만 정하지 말고, 어떤 콘텐츠를 가리고 어떤 layout을 남길지 같이 결정해야 한다.
| 점검 항목 | 좋은 기준 | 나쁜 기준 | 수정 방향 |
|---|---|---|---|
| 파일 위치 | 대기할 page와 같은 세그먼트 | 너무 상위에 하나만 둠 | 목록/상세 fallback 분리 |
| UI 형태 | 최종 콘텐츠와 비슷한 skeleton | 의미 없는 spinner만 표시 | 대체될 영역의 구조 반영 |
| 범위 | layout은 유지, page 영역만 대기 | 전체 화면을 지움 | layout과 page 책임 분리 |
| 우선순위 | 가장 가까운 loading이 담당 | 상위 fallback이 모든 화면을 덮음 | 하위 세그먼트에 구체적 loading 추가 |
| 클라이언트 훅 | 필요할 때만 use client | loading 전체를 습관적으로 client로 만듦 | 브라우저 API 사용 여부로 결정 |