next에서는 모든 페이지가 사용자에게 전해지기 전에 HTML을 미리 생성하는 프리 렌더링을 수행한다.

크게 두 가지 과정으로 나뉜다.

• intial load

  JS가 적용되지 않은 HTML을 로드해서 화면에 보여주는 과정. JS 파일은 아직 로드되기 전이므로 <Link />와 같은 컴포넌트들은 아직 동작하지 않는다.

• hydration

  JS 파일을 서버로부터 받아 HTML과 연결시켜주는 과정. React 컴포넌트들이 초기화되고 사용자와 상호작용할 준비를 마친다.

NextJS에서는 크게 두 가지의 Pre-Rendering 방법을 제공한다.

1. Static Site Generation : html 을 빌드 타임에 생성하고 각 요청에 따라서 재사용한다. (SSG)
2. Server Side Rendering : html을 각 리퀘스트가 일어날 때 마다 생성 (SSR)

매 요청마다 data가 자주 업데이트 되는 이를테면 요청마다 콘텐츠가 달라지는 경우는 SSR을 선택해야 하고, 그것이 아니라면 SSG를 선택하는 것이 적절하다.