☂️ Hard Navigation

• MPA (Multi Page Application) => 페이지의 완전한 교체.
• Trigger: 전통적 <a> 태그.
• 비효율적인 재건축.
• 단점:
  1. 화면 깜박임. (White Flash)
  2. 브라우저 새로고침 == 메모리 초기화 => 데이터 증발 (State Amnesia).
  3. 비효율: 공통 레이아웃 요소까지 모두 리렌더링.

☂️ Soft Navigation

• React Router: JSON과 JS가 도착 => 브라우저가 JS를 파싱 후 화면을 렌더링. (클라이언트측 연산 부담)
• Next.js Router: RSC Payload가 도착 => Payload에 맞춰 배치만 함. (브라우저 부담: 🔽, 속도: 🔼)

🌂 프리패칭(Prefetching)

• 실제 이동전 백그라운드에서 미리 준비.
  1. 감지(Viewport): 링크가 사용자의 눈에 들어오는 순간, Next.js가 감지.
  2. 다운로드(Background): 사용자가 클릭도 하기 전에, 백그라운드에서 다음 페이지의 데이터를 몰래 받아옴.
  3. 즉시 전환(Instant Transition): 사용자가 실제 클릭시, 대기 시간 없이 바로 화면 전환.