**task-2228 완료 보고** (dev4-team) **task-2228 완료 보고서: InsuRo 메뉴 이동 시 빈 화면 개선 — Prefetch + Skeleton UI** (9분 25초) **핵심 결과** 3개 파일 수정 + 1개 유틸리티 신규 생성으로 구현 완료. (1) PageLoader를 DashboardLayout 구조의 Skeleton UI로 교체하여 시각적 피드백 제공, (2) 25개 주요 페이지에 대한 prefetchRoute 유틸리티 생성, (3) TopNavBar 탭 hover 시 해당 탭 전체 아이템 prefetch, (4) ContextSubMenu(사이드바) 링크 hover 시 개별 페이지 prefetch. `npm run build` 성공, 콘솔 에러 0건. ## 수정 파일 | 파일 | 변경 내용 | grep 검증 | 상태 | |------|-----------|-----------|------| | src/App.tsx | PageLoader를 스피너→Skeleton UI로 교체 (animate-pulse 5개소) | grep "animate-pulse" 5건, grep "animate-spin" 0건 | verified | | src/utils/prefetchRoute.ts (신규) | 25개 경로 importMap + prefetchCache 중복방지 + prefetchRoute() export | grep "export function prefetchRoute" 1건 | verified | | src/components/navigation/TopNavBar.tsx | prefetchRoute import + domainTab button에 onMouseEnter 추가 | grep "prefetchRoute" 2건, grep "onMouseEnter" 1건 | verified | **발견/해결 이슈 3건** 1. **React.lazy 내부 접근 불가** — importMap 방식으로 별도 경로→import 매핑 생성하여 우회 2. **hash URL 처리 (#namecard)** — ContextSubMenu에서 `item.url.split("#")[0]`로 해시 제거 후 prefetch 3. **prefetch 중복 호출 방지** — Set 기반 `prefetchCache`로 동일 경로 재요청 방지, 실패 시 캐시 제거하여 재시도 허용