서버 측 렌더링
서버 측 렌더링(Server-Side Rendering, SSR)은 웹 애플리케이션의 HTML 콘텐츠를 브라우저가 아닌 서버에서 생성한 뒤 클라이언트에 전송하는 렌더링 방식이다. 서버는 요청에 필요한 데이터와 템플릿 또는 구성 요소를 이용해 HTML 응답을 만들고 브라우저는 수신한 내용...
| 분류 | 웹 문서 생성 방식 |
|---|---|
| 핵심 기능 | 요청 처리 서버에서 HTML을 생성하는 방식 |
| 관련 기술 | World Wide Web, HTML, 웹 브라우저, 웹 서버 |
| 참고 자료 | MDN: Server-side rendering |
서버 측 렌더링(Server-Side Rendering, SSR)은 웹 애플리케이션의 HTML 콘텐츠를 브라우저가 아닌 서버에서 생성한 뒤 클라이언트에 전송하는 렌더링 방식이다. 서버는 요청에 필요한 데이터와 템플릿 또는 구성 요소를 이용해 HTML 응답을 만들고 브라우저는 수신한 내용을 파싱하여 표시한다. 초기 화면을 완성하는 데 필요한 텍스트와 구조를 서버가 제공할 수 있어 검색 크롤러와 다양한 클라이언트가 콘텐츠를 읽는 데 도움이 된다.
전통적인 동적 웹사이트는 요청할 때마다 서버의 템플릿에 데이터를 삽입하여 완성된 페이지를 생성했다. 현대의 SSR은 컴포넌트 기반 UI 프레임워크에서도 적용되며 서버가 생성한 마크업과 브라우저의 JavaScript 실행을 결합할 수 있다. 서버가 만든 문서에 클라이언트 프로그램의 이벤트 핸들러를 연결해 대화형 기능을 복원하는 과정을 하이드레이션(hydration)이라고 부른다.
서버는 요청별로 데이터베이스와 웹 API를 조회하거나 이미 계산된 결과를 캐시하여 응답을 생성할 수 있다. 처리 시간이 길어지면 첫 번째 바이트가 도착하는 시간에 영향을 주므로 데이터 조회와 템플릿 실행 비용을 관리해야 한다. 스트리밍 SSR은 가능한 HTML 부분을 먼저 전송하여 나머지 데이터 처리가 완료되기 전에 일부 화면을 표시할 수 있게 한다.
서버 측 렌더링은 클라이언트 측 렌더링과 상호 배타적인 방식이 아니다. 서버는 처음 화면을 생성하고 이후의 화면 변화는 브라우저가 처리하는 하이브리드 구조가 일반적으로 사용된다. 빌드 시점에 HTML을 만드는 정적 생성과 요청 시점에 HTML을 만드는 SSR은 콘텐츠 생성 시각과 캐시 특성이 다르므로 구별한다.
SSR은 사용자에게 콘텐츠를 빠르게 노출하고 스크립트를 사용할 수 없는 환경에서 기본 정보를 제공하는 데 도움이 될 수 있다. 그러나 서버의 처리 부하와 사용자별 캐시 정책, 서버·클라이언트 렌더링 결과의 일치도는 운영상 중요한 문제다. 사용자의 개인정보가 포함된 HTML을 공유 캐시에 잘못 저장하지 않도록 주의하고 애플리케이션의 권한 검사를 서버에서 수행해야 한다.[1]