해외 숙소 리스트 성능 개선기 : 반쪽짜리 SSR에서 완벽한 인피니트 스크롤까지
10
AI 요약
이 글은 AI가 원문을 분석하여 핵심 내용을 요약한 것입니다.
이 게시물은 해외 숙소 리스트 페이지의 SSR 보완과 인피니트 스크롤 성능 개선기입니다.
핵심 변경
- 첫 페이지를 서버에서 렌더링하고 Hydration으로 React가 이어받도록 변경
- LCP 2.8s→2.2s, TBT 90ms→10ms 개선
- useInfiniteQuery와 sessionStorage 결합해 뒤로가기 시 스크롤 위치 복구( gcTime 5분, refetch 비활성화)
- 외부 API 엣지케이스 대응: 빈 데이터 수신 시 재귀 페칭으로 다음 데이터 확보, 결과가 적을 땐 더보기 버튼으로 대체
- 빠른 스크롤 시 사용자가 업데이트를 놓치는 문제 해결을 위해 모바일에서 Footer 제거
