프론트엔드

SSR vs CSR

SSR은 서버에서 HTML을 그려 보내고, CSR은 브라우저에서 자바스크립트로 그립니다.

화면을 어디서 그리느냐에 따른 두 렌더링 방식입니다. 초기 로딩과 SEO에서 차이가 큽니다.

SSR를 쓸 때

첫 화면 속도와 SEO가 중요한 콘텐츠·커머스 사이트에 적합합니다.

로그인 후 대시보드처럼 SEO가 덜 중요하고 상호작용이 많은 앱에 적합합니다.

SEO·첫 화면 표시(FCP)는 SSR이 유리합니다. 다만 SSR도 자바스크립트를 입히는 하이드레이션 전까지는 상호작용이 지연될 수 있어, "초기 로딩이 빠르다"는 첫 페인트 기준임을 기억하세요. Next.js·Nuxt는 둘을 페이지별로 섞어 쓸 수 있습니다.