70. 클라이언트 사이드 렌더링(CSR)과 서버 사이드 렌더링(SSR)

Mission: 클라이언트 사이드 렌더링(CSR)과 서버 사이드 렌더링(SSR) 관련 질문 정리

📌

클라이언트 사이드 렌더링(CSR)과 서버 사이드 렌더링(SSR)의 개념에 대해 설명해주시고, 장/단점을 설명해주세요.

• 클라이언트 사이드 렌더링 (Client-Side Rendering, CSR):
  • 개념: 웹 페이지의 내용을 서버에서 가져오는 대신, 초기에 HTML 및 기본 구조를 렌더링하고, 그 이후에 JavaScript를 사용하여 동적으로 데이터를 로드하고 렌더링하는 방식입니다. 일반적으로 단일 페이지 애플리케이션(SPA)에서 사용됩니다.
  • 장점: 빠른 초기 로드 시간, 부드러운 사용자 경험, 서버 부하 감소, 빠른 데이터 갱신, 클라이언트 측 캐싱 가능.
  • 단점: 초기 로드 시간이 길 수 있음, SEO에 제약이 있을 수 있음, 모든 로직을 클라이언트에서 처리해야 하므로 보안에 주의가 필요함.
    
    
• 서버 사이드 렌더링 (Server-Side Rendering, SSR):
  • 개념: 서버에서 모든 페이지의 내용을 렌더링하고 완성된 HTML을 클라이언트로 보내는 방식입니다. 사용자가 요청할 때마다 서버에서 새로운 페이지를 생성합니다.
  • 장점: 검색 엔진 최적화(SEO)에 유리, 초기 로드 시간이 빠름, 모든 내용을 서버에서 관리하므로 보안에 강력함.
  • 단점: 페이지 간 전환 시 일반적으로 느릴 수 있음, 서버 부하가 높을 수 있음, 사용자 경험이 덜 부드러울 수 있음.
    
    요약하면, 클라이언트 사이드 렌더링은 초기 로드가 빠르고 사용자 경험이 부드러우며 클라이언트에서 모든 로직을 처리하는 장점이 있지만, 초기 로드 시간이 길고 SEO에 취약합니다. 서버 사이드 렌더링은 초기 로드가 빠르고 SEO에 강력하지만 페이지 간 전환 시 느릴 수 있으며 서버 부하가 높을 수 있습니다. 선택은 프로젝트 요구사항과 성능/SEO 등의 요소에 따라 다릅니다.