Static Site Generation
SSR, CSR 모두 유저가 리퀘스트를 날린 시점마다 렌더링을 한다는 공통점이 있었다. 서버에서 렌더링을 하든 클라이언트에서 렌더링을 하든 유저가 어느 시점에 요청을 보내는지가 중요했다. 그러나 모든 콘텐츠가 유저가 요청을 보낸 시점에 렌더링이 되어야 할까? 그렇지 않다. 뉴스 기사 사이트, 상품 진열 사이트 등을 생각해보자.
SSG는 사이트를 빌드하는 시점에 미리 html을 만든다. 미리 만들어 놓은 html을 유저에게 전달하는 것이다. 장점은 API 서버에 대한 부하가 훨씬 줄어들게 된다는 것이다. 규모가 큰 서비스의 경우 비용 측면에서 훨씬 절약이 된다!
정적 사이트 빌드 -> 정적인 html, css, js로 나옴 -> CDN, S3에 업로드 -> S3, CDN의 경로를 그대로 유저에게 내려준다 -> 유저는 정적 사이트에 접속하게 됨.
CDN은 대용량 트래픽에 굉장히 최적화되어 있다. 한번에 몇 테라바이트의 데이터가 들어와도 내려줄 수 있다. 즉 트래픽이 아무리 튀더라도 SSG로 만든 사이트는 웬만하면 안 죽는다. 즉 SSG는 데이터 자체가 자주 갱신되지 않는 콘텐츠에 대해서는 최고의 선택이라 할 수 있다.
CSR, SSR, SSG를 적절히 섞어서 쓰는 것이 가장 중요하다! 하나만 고집하면 오히려 더 큰 문제가 된다.
Next.js는 SSG와 SSR을 모두 지원한다. 예를 들어, 상세페이지를 만들 때는 SSG를 쓰고, 일반 목록 페이지 같은 것을 만들 때는 SSG를 쓰는 것이 가능하다.