Next JS 렌더링 차이

v12 vs v13

v12
페이지 단위로 렌더링 방식을 규정
getStaticProps()
getServerSideProps()
v13
컴포넌트 단위로 렌더링 방식을 규정

서버 컴포넌트 vs 클라이언트 컴포넌트

서버 컴포넌트는 이름에서도 알 수 있듯이 서버에서 렌더링되고 fetch됨.
클라이언트 컴포넌트는 클라이언트(브라우저)에서 렌더링되고 fetch됨.
동적인 상호작용이 필요한 컴포넌트와 정적인 정보를 보여주는 컴포넌트를 분리하여 각각 클라이언트 컴포넌트와 서버 컴포넌트로 설정함으로써 페이지의 성능을 최적화하고 사용자 경험을 향상시킬 수 있음.