Antigravity Agent
3.1 KiB
3.1 KiB
category, tags, title, description, last_updated
| category | tags | title | description | last_updated | |||
|---|---|---|---|---|---|---|---|
| Other |
|
Static Site Generation (SSG) | Static Site Generation (SSG)는 애플리케이션을 빌드하고 배포하는 과정에서 여러 라우트에 대한 HTML을 사전에 렌더링(pre-render)하여 생성하는 기술이다 [1, 2]. | 2026-05-04 |
Static Site Generation (SSG)
📌 Brief Summary
Static Site Generation (SSG)는 애플리케이션을 빌드하고 배포하는 과정에서 여러 라우트에 대한 HTML을 사전에 렌더링(pre-render)하여 생성하는 기술이다 [1, 2]. 이는 서버 사이드 렌더링(SSR)의 하위 변형(sub-variant)으로 간주되며, 런타임에 서버가 요청을 처리할 필요 없이 빌드 시점에 정적 HTML 파일들을 만들어 원하는 곳에 호스팅할 수 있게 해준다 [1, 3].
📖 Core Content
- 빌드 타임 렌더링 (Build-time Rendering): SSG는 사용자의 요청이 들어올 때마다 실시간으로(on-demand) 화면을 구성하는 대신, 애플리케이션을 컴파일하고 빌드하는 단계에서 미리 HTML을 생성한다 [1-3].
- Next.js 환경의 기본 동작: Next.js의 App Router 환경에서는 실시간 데이터 처리가 반드시 필요한 경우가 아니라면, 기본적(by default)으로 빌드 타임에 이러한 정적 사이트 생성 작업이 수행된다 [3]. 프레임워크 수준에서 점진적 정적 재생성(Incremental Static Regeneration)과 같은 기능을 지원하여 복잡한 애플리케이션의 성능과 확장성 확보에도 기여한다 [4].
- React Server Components (RSC)와의 시너지: React Server Components는 렌더링 시점에 따라 동적 생성(on-demand)뿐만 아니라 빌드 시점(during the build)에도 실행될 수 있다 [3]. 따라서 RSC를 활용해 런타임 서버 없이도 다수의 정적 HTML 파일을 생성하고 호스팅하는 방식의 아키텍처를 구성할 수 있다 [3].
⚖️ Trade-offs & Caveats
- 자바스크립트 종속성과 하이브리드 라우팅: Next.js와 같은 프레임워크 환경에서 SSG와 RSC를 사용할 때, 완전히 자바스크립트가 배제된(truly static no-JS) 순수 정적 웹사이트를 구축하는 것은 프레임워크의 특성상 제약이 따른다 [5]. 이는 Next.js 프레임워크 자체에 라우팅 등을 관리하기 위해 클라이언트 측에서 실행되어야 하는 필수 코드가 포함되어 있기 때문이다 [5].
- 사용자 경험(UX) 최적화라는 반대 급부: 정적 페이지임에도 클라이언트 자바스크립트가 필요한 구조는 오히려 사용자 경험을 향상시키는 반대 급부를 제공한다 [5]. 잘 구조화된 애플리케이션은 자바스크립트가 다운로드되는 동안에도 정상적으로 동작하며, 로드가 완료된 후에는 프레임워크의 라우터가 일반적인
<a>태그보다 더 빠르게 탐색을 처리하게 된다 [5]. - 이 외에 SSG 도입 시 발생할 수 있는 구체적인 단점이나 여타 제약 사항에 대해서는 소스에 관련 정보가 부족합니다.
Last updated: 2026-05-03