Developer Cafe

SPA, CSR, SSR, SSG 본문

개발자답게

SPA, CSR, SSR, SSG

개발자 카페 2021. 2. 16. 22:20
728x90

SPA(single page application)

  • 한페이지에서 사용자가 필요한 부분만 업데이트해서 보여주는 방식

CSR(client side rendering)

서버에서 html을 받아와 적힌 js주소를 서버요청해 동적으로 사용자에게 최종적인 어플리케이션을 보여준다.

  • 서버에 정보를 넘겨야 처음보이는 화면을 나타낼 수 있기에 클라이언트에게 제공되는 서비스 시간이 오래걸릴 수 있다.
  • html에는 어느 정보를 받아와야된다는 것만 적혀있기에 검색엔진같은 기능구현이 어렵다. (Low SEO)

SSR(server Side Rendering)

사이트 주소요청시 서버가 필요데이터를 받아 바로 사용자에게 보여주게 해주는 방식

  • CSR보다 더 빠르게 사용자에게 화면을 보여줄수있다.
  • html에 모든 정보가 담겨져 있게에 좀 더 효율적인 SEO를 할 수 있다.
  • 클릭때마다 서버에서 데이터를 요청하기에 과부화가 걸리기 쉽다.
  • 사용자에게 화면제공은 되지만 동적인 js를 받아오는데 시간이 걸리므로 동작하지 않을 수 있다.

SSG(Static Site Generation)

  • CSR과 SSR의 단점들을 보완하기 우이하여 좀더 매끄러운 서비스를 위하여 미리 서버에 화면을 저장해 두었다가 꺼내쓰는 방식이다.
728x90

'개발자답게' 카테고리의 다른 글

REST API, SOAP API 차이  (0) 2021.03.18
동기 비동기 차이  (0) 2021.03.17
프레임워크와 라이브러리 차이점  (0) 2021.03.15
정규표현식  (0) 2021.03.04
TTV(Time To View) vs TTI(Time To Interact)  (0) 2021.02.16
Comments