SSG SSR CSR

navida·2022년 5월 6일
0

SSG(Static-Site-Generation)

브라우저에서 웹페이지를 보여주기위해 HTML CSS JAVASCRIPT 파일을 다운받아 랜더링하게되는데 클라이언트에서 보여줘야하는 페이지들을 미리 다운받아놨다가 필요한 순간에 브라우저에 바로 보여주게되는 방식으로 미리 모든 페이지들이 다운로드 되어 있기 때문에 속도가 빠르다는 장점이 있다.

SSR

24시간 대기 상태인 프론트에서 백엔드에 요청하고 데이터를 받은 후 브라우저에 전송하여 랜더링해준다.
SSR을 이용하지않으면 curl이나 axios로 데이터를 요청하게되면 하드타이핑 이외에 동적으로 데이터가 필요한 정보들은 받아 올 수 없다.(게시글 상세보기, 상품 상세보기)

CSR

가장 초창기의 방식으로 브라우저에서 랜더링하기 위해 필요한 HTML JAVASCRIPT CSS 파일을 클라이언트 페이지에 렌더링 한다. 브라우저에서 요청을 서버로 보내면 서버는 웹 페이지에서 렌더링하는것이 아니라 요청한 페이지를 클라이언트에 보낸다. 서버는 웹페이지와 함께 JAVASCRIPT 파일을 보내고 클라이언트가 웹페이지를 받으면 렌더링하게 된다. 파일 크기가 커질수록 무거워지기 때문에 속도가 현저히 느려지고 모든 파일을 브라우저에서 가지고 있기 때문에 보안성이 떨어진다.

profile
프론트엔드 개발자

0개의 댓글