SavedRoutesList 동적 import로 초기 로딩 속도 개선

🤖 770 in / 845 out / 1615 total tokens

SearchOverlay 컴포넌트에서 SavedRoutesList를 동적 import로 변경했다. Next.js의 dynamic 함수를 활용해 초기 번들 크기를 줄였고, 로딩 중에는 스켈레톤 UI를 표시하도록 했다. ssr: false 옵션으로 클라이언트 전용 렌더링을 적용해 불필요한 서버 사이드 렌더링을 방지했다. 함께 사용하지 않던 useSavedRouteStore import도 정리했다. 766개 테스트 모두 통과.

import dynamic from 'next/dynamic';
 
const SavedRoutesList = dynamic(
  () => import('@/components/saved-routes/SavedRoutesList')
    .then(mod => mod.SavedRoutesList),
  {
    loading: () => <SavedRoutesSkeleton />,
    ssr: false
  }
);

v0.65.0 출시. 동적 import 하나로 번들 최적화 완료.

Next.js 성능최적화 동적import CodeSplitting