SSR 서버 최적화로 비용 절감

이 게시물은 SSR(Server Side Rendering) 아키텍처의 운영과 최적화 방법에 대해 설명합니다.

SSR 도입 배경과 효과

• SSR은 초기 HTML 렌더링을 서버에서 처리해 사용자 경험을 개선
• 토스는 SSR 도입 후 로딩 속도를 크게 줄이고 서버 수를 절감하여 비용을 개선

성능 측정과 최적화 전략

• 성능 측정 환경 구축과 변인 통제의 중요성 강조
• RPS(Request Per Second) 및 Node.js Event Loop 매트릭 활용
• CPU 프로파일링과 Opentelemetry 추적으로 병목 지점 파악

구체적 최적화 사례

• React Query 데이터 직렬화 과정 제거
• Yarn 버전 업데이트로 모듈 로딩 오버헤드 감소
• Express 제거 후 내장 http 서버 사용으로 CPU 사용량 절감

최적화의 교훈

서버 사이드 JavaScript는 브라우저와 달리 지속적 실행과 네트워크 환경 이해가 필요하며, 철저한 성능 측정과 재현 환경 구축이 성능 개선에 필수적입니다.