Pre-fetching은 페이지 전환 전에 해당 페이지의 JS 번들을 미리 받아오는 기능이다. Next.js는 <Link>
컴포넌트를 사용할 때 자동으로 prefetch를 수행하여 페이지 전환을 빠르게 만든다.
Next.js는 페이지 단위로 코드 분할(code splitting)을 수행한다.
예:
/index → A component, B component
/search → C component, D component
사용자가 /index
에서 /search
로 이동하면, 그 순간에 /search
의 JS 번들을 받아오게 되면 로딩 시간(TTI)이 발생함.