오늘은 SSR과 CSR에 대해 알아보자

SSR

개념

• 전통적인 렌더링 방식으로 요청시 마다 새로고침이 일어나 서버에 새로운 페이지에 대한 요청을 하는 방식

장점

• 초기 페이지를 서버 사이드에서 생성함으로 SEO에 적합

단점

• 사용자와 소통 시 부분 렌더링이 아니라 페이지를 리로딩하기 때문에 서버 렌더링에 따른 부화가 발생
• 페이지 이동 시 화면이 깜빡이기 때문에 좋은 사용자 경험을 전달하는 데 무리

CSR

개념

• 컴퓨터보다 성능이 떨어지는 스마트폰 웹에 대한 요구가 커지면서 클라이언트 사이드 렌더링 탄생
• 요청 시 최초에 한 번 서버에서 전체 페이지를 로딩하여 보여주고, 이후에는 사용자의 요청이 올 때마다, 클라이언트에서 렌더링 한다.

단점

• 구동 속도가 느림(페이지, 자바스크립트를 읽고 자바스크립트가 화면을 그리는 시간까지 모두 마쳐야 사용자에게 뷰가 보여짐)
• 가장 큰 단점으로 검색엔진 최적화에 부적합
  (봇들이 초기 HTML을 빈 파일로 인식함. 그래서 구글 검색엔진 외에 네어비, 다음 등의 검색 엔진 최적화가 필요)

장점

• 사용자 행동에 따라 필요한 부분만 수정해서 보여주기 때문에 초기 구동이후에는 빠른 속도로 렌더링

보완책

• 이러한 검색엔진 최적화를 위해 서버사이드와 클라이언트 사이드 렌더딩을 동시에 사용

  주요 핵심 사이트를 서버사이드 렌더링으로 변경하는 방법