목차
SSR이란?
SSR(Server-Side Rendering)은 웹 애플리케이션에서 서버에서 HTML을 생성하여 클라이언트에게 전달하는 방식입니다. 기존의 CSR(Client-Side Rendering) 방식과는 달리 초기 페이지 로딩 시 서버에서 페이지를 완성하여 사용자에게 제공합니다.
SSR의 장단점
SSR은 다음과 같은 장점을 가지고 있습니다.
- 초기 페이지 로딩 속도 향상: 사용자가 첫 페이지를 더 빠르게 볼 수 있습니다.
- 검색 엔진 최적화(SEO): 검색 엔진은 SSR을 이용한 페이지를 쉽게 수집할 수 있습니다.
- 응답성 향상: 서버에서 완성된 페이지를 제공하기 때문에 초기 로딩 시 사용자는 빈 페이지를 보지 않고 빠른 인터렉션을 경험할 수 있습니다.
하지만 SSR은 일부 단점도 가지고 있습니다.
- 서버 리소스 부하: 많은 사용자 요청 시 서버에 부하가 발생할 수 있습니다.
- 개발 복잡도: 클라이언트와 서버 간의 동작을 조정해야하기 때문에 개발이 복잡해질 수 있습니다.
SSR 성능 측정 방법
SSR 웹 애플리케이션의 성능을 측정하기 위해서는 다음과 같은 방법을 사용할 수 있습니다.
-
로딩 시간 측정: 초기 페이지 로딩 시간을 측정하여 성능을 평가할 수 있습니다. 네트워크 탭을 이용하여 서버에서 클라이언트로 전달되는 시간을 측정할 수 있습니다.
-
TTFB(Time To First Byte) 측정: 서버로부터 첫 번째 바이트를 수신하는 시간을 측정할 수 있습니다. TTFB가 짧을수록 성능이 우수합니다.
-
페이지 렌더링 시간 측정: 페이지가 완전히 렌더링되는 시간을 측정할 수 있습니다. 이를 위해 로딩 이벤트를 캡처하고 시간을 측정할 수 있습니다.
SSR 성능 튜닝 방법
SSR 웹 애플리케이션의 성능을 향상시키기 위해 다음과 같은 방법을 사용할 수 있습니다.
-
캐싱 활용: 캐싱을 통해 렌더링된 페이지를 저장하고 재사용할 수 있습니다. 이를 통해 서버의 부하를 줄일 수 있습니다.
-
압축 사용: 전송되는 데이터를 압축하여 네트워크 대역폭을 줄일 수 있습니다. Gzip 압축을 이용하는 것이 일반적입니다.
-
로딩 최적화: 페이지 로딩 시 필요한 리소스(스타일시트, 스크립트 등)를 압축하고 최소화하여 네트워크 전달 시간을 단축합니다.
-
서버 인프라 확장: 서버에 부하가 많이 발생하거나 성능이 저하된다면 서버 인프라를 확장하여 처리 능력을 향상시킬 수 있습니다.
참고 자료
- The Benefits of Server Side Rendering Over Client Side Rendering
- Server-Side Rendering: A Comprehensive Guide