-
CSR, SSR, NEXTjsreact 2021. 12. 6. 17:49반응형
이전에는 multipageform > 스마트폰 출현 > singlepageapplication 필요해짐
(ServerSideRendering) (ClientSideRendering)
각각 url 변경의 의미가 다르다
ssr 에서는 새로운 요청을 의미하지만 csr 에서는 단지 페이지의 전환만을 이야기 한다.
변화된 페이지에 해당하는 데이터를 이용해 렌더링 한다.
ssr 은 아예 그려진 페이지 를 받아오는 개념 이고
csr 은 빈페이지에 클라이언트측에서 페이지를 그린다.
기존의 ssr은 필요한 리소스가 있을때 url 변경하면서 요청 하면서 리소스가 반영된 페이지를 받아오지만
csr 같은 경우 모든리소스를 처음에 다 받아오고 url 변경시 가지고 있는 리소스를 이용해 클라이언트측에서 화면을 변경한다.
csr 의 두가지 특징
1.초기에 많은양의 리소스를 가져온다. > 처음에 오래걸림 > codesplitting 으로 보완가능
2.처음 요청시에 빈페이지를 가져온다. > 검색최적화 안됨 > 처음 페이지는 ssr로 받아오고 이후 페이지 전환은 csr방식으로 보완가능
위2가지 특징을 보완하는 프레임워크가 next.js 이다.
'react' 카테고리의 다른 글
Next.js css in js(styled component) (2) (0) 2021.12.08 Next.js css in js(styled component) (1) (0) 2021.12.06 router in useEffect (0) 2021.11.29 [react] 성능 최적화 (3) 2021.05.11 [react] 리렌더링이 되는 조건들 살펴보기 (0) 2021.05.10