My Boundary As Much As I Experienced

SSG(Static-Site-Generation)의 장점은 정적사이트를 CDN에 저장할 수 있다는 것 본문

FrontEnd/Next.js

SSG(Static-Site-Generation)의 장점은 정적사이트를 CDN에 저장할 수 있다는 것

Bumang 2024. 4. 19. 00:20

요새 넥스트JS에 대해 배우면서 CSR vs SSR vs SSG에 대한 비교해보았다.

그런데 CSR과 SSR은 쉽게 구분이 가지만 SSR과 SSG을 구분하는건 조금 어려웠다.

 

'SSG는 빌드 시 정적 컨텐츠를 미리 만들어둬서 이 파일들만 단순히 반환하기 때문에

SSR보다 서버호출 비용이 낮으며 성능도 좋다.'라는데...

 

'어쨌든 SSG라도 사용자에게 만들어 둔 정적 컨텐츠를 줘야하는거잖아?

SSG로 만들든 SSR로 만들든 똑같은 크기의 사이트를 사용자에게 제공해준다면 크게 성능차이가 있나?

조립해두고 주는 거 vs 요청받고나서 조립하는거의 시간 차이는 있겠지만, 결국 보내는 데이터양의 비용은 똑같지 않나?'

라는 의문점이 들었다.

 

그런데 SSG의 장점이 잘 발휘되는 시점은 캐싱을 잘 해뒀을 때였다.

SSG로 만들어 둔 정적 사이트를 서버가 주는 것이 아니라 CDN같은 곳에 캐싱해둘 수 있다.

그래서 서버 호출 자체를 없애버릴 수 있기 때문에, 성능면으로도 비용면에서도 좋은 것이다.