라우트 기반 코드 스플리팅 (Route-Based Splitting)

각 라우트별로 컴포넌트를 지연 로딩하는 RouteRegistry를 구현하세요.

라우트 기반 코드 스플리팅은 SPA의 초기 번들 크기를 줄이는 핵심 기법입니다. 사용자가 라우트로 이동할 때만 해당 컴포넌트 코드를 가져오고, 한 번 로드된 컴포넌트는 메모이즈되어 다시 호출되지 않습니다.

API

class RouteRegistry<Component> {
  register(path: string, loader: () => Component): void;
  resolve(path: string): Component;       // loader를 한 번만 호출(메모이즈)
  loadedRoutes(): string[];               // 이미 resolve된 경로 목록 (등록 순서 유지)
}

요구사항

• register로 등록된 경로만 resolve 가능, 미등록 경로는 오류
• resolve(path)는 첫 호출 시에만 loader() 실행 (이후는 캐시된 컴포넌트 반환)
• 같은 경로를 여러 번 resolve해도 동일한 인스턴스 반환
• loadedRoutes()는 실제로 resolve된 경로만, 등록 순서대로 반환

학습 포인트

• 지연 로딩 (lazy loading)과 메모이제이션 결합
• 라우트 단위 코드 분할 의미론
• 캐시 기반 단일 인스턴스 보장