Search

서버 사이드 렌더링(SSR)

Tag
Web
Frontend
SSR
Category
프론트엔드
Description
서버 사이드 렌더링(SSR)은 서버에서 HTML을 생성해 클라이언트에 전송하여 웹 콘텐츠 렌더링 속도를 높인다. 내가 생각하기에 SSR은 검색 엔진 최적화에 유리하다.
AI 키워드
ID
8
Title
포스팅
2023/08/12
1 more property

서비에서 렌더링? 클라이언트에서 렌더링?

CSR, SSR 둘다 컨텐츠를 어디서 만들어 내느냐에 따라 포커싱이 맞추어져 있다
컨텐츠를 서버에서 만들면 서버사이드렌더링, 클라이언트에서 만들면 클라이언트 사이드 렌더링이다

SSR을 언제 많이 쓸까?

보통의 경우 웹 컨텐츠가 많을때 많이 사용한다고 한다
왜 웹 컨텐츠가 많을때 사용할까?
보통은 Server가 Client보다 컴퓨팅 파워가 강력하다고 한다. 내가 생각하기에 이 이유는 Client는 브라우저라는 프로그램을 통해서 랜더링을 하기 때문인 것 같다. 브라우저의 파워는 결국 하나의 페이지 랜더작업만 하지 않기 때문에 Server보다 느리다고 하는 것 같다

SSR의 FLOW

Server -> DB -> API -> HTML 이 플로우가 서버에서 이루어진다

SSR이 CSR보다 빠르다?

SSR이 CSR보다 파워가 강력하다고 했다. 하지만 최초의 로딩은 CSR보다는 느릴 수 있다. 그 이유로는 SSR은 서버에서 그때그때 필요한 HTML을 그려서 내려주기 때문이다

SSR을 쓰는 이유는?

우리의 사이트는 User만 사용하는건 아니다. 크롤러(ex: 구글 서치 크롤러)도 우리의 사이트를 이용하기 때문에 CSR을 하는 작업에서는 DOM을 만들고 JS를 해석하는 시간과 Layout, Paint를 하고 이러한 작업들이 오래 걸린다고 볼 수 있다.하지만 SSR은 완성된 HTML을 보내주기때문에 JS를 따로 해석을 안해고 랜더플로우를 쭉 진행할 수 있다. 그렇기 때문에 컨텐츠를 랜더링하는 속도가 SSR이 더 빠르다

검섹엔진은

검색엔진은 패스트사이트부터 우선노출을 한다
검색엔진 최적화라는 말은 컨텐츠가 뜨는 속도를 빠르게 하는 작업을 말하는 것 같다
서버사이드 렌더링은 진짜 단순하게 서버에서 완성해서 보내준다(?)로 받아들여도 좋을 것 같다!