CSR (1) 썸네일형 리스트형 NextJS 14의 렌더링 방식 (Hydration)🍀 NextJS는 React의 프레임워크로, 기본적으로 CSR(클라이언트 사이드 렌더링)을 지원하는 리액트와는 다르게 SSR(서버 사이드 렌더링)을 지원하기 때문에 검색엔진 최적화에 유리하고, 초기 렌더링 속도가 빠르다. 그밖에도 서버 데이터 패칭,캐싱 등 최적화를 너무 쉽게 할 수 있어서 성능을 대폭 향상시킬 수 있다. 오늘은 CSR과 SSR을 자세히 비교해보고 NextJS 14버전에서 지원하는 Hydration까지 알아보자. 1. CSR과 SSR 1) CSRCSR(클라이언트 사이드 렌더링)은 클라이언트에서 모든 렌더링을 담당하는 것을 말한다. 리액트는 기본적으로 CSR을 지원한다. 따라서 초기 렌더링 시에 자바스크립트를 다운받고 UI를 로드한다. 장점부드럽고 빠른 화면 전환 (깜빡임 이슈 없음)서버에 부.. 이전 1 다음
