loading experience

loading.tsx는 위치감을 보존하는 대기 화면이다

유지되는 레이아웃과 교체될 콘텐츠를 분리해 사용자가 어느 화면을 기다리는지 알게 만드는 것이 핵심이다.

layout remains, content waits 느린 page 영역만 skeleton으로 바꾸고, 상위 layout은 화면의 좌표로 남긴다.

fallback 적용 흐름
구간	브라우저가 보는 것	설계 기준
요청	데이터가 필요한 route에 진입한다	가장 가까운 `loading.tsx`를 찾는다
대기	layout과 fallback HTML을 먼저 받는다	실제 콘텐츠와 비슷한 크기의 skeleton을 둔다
교체	데이터 준비 뒤 page 콘텐츠로 바뀐다	위치와 높이 변화가 작아야 한다

size 카드, 목록, 상세 화면의 실제 크기에 맞춘다

nearest 목록과 상세의 대기 문맥이 다르면 폴더를 나눈다

stream 준비된 레이아웃을 먼저 보내 빈 화면을 줄인다

client 브라우저 API가 필요하면 client 경계를 별도로 둔다