[11장][효중] Next.js 13과 리액트 18

[khj0426]

퀴즈

서버 컴포넌트는 왜 등장했고 어떤 문제를 해결하려 했나요?

답

정답

- 번들 크기가 0인 컴포넌트를 만들 수 없다. 만약 외부에서 설치한 패키지를 쓸 때 해당 패키지 크기가 크다면, 해당 패키지를 사용자 환경에 의존해 다운받고 실행까지 거쳐야 한다.

• 백엔드 리소스에 대한 직접적인 접근이 불가능하다.

• 자동 코드 분할이 불가능하다. 일반적으로 리액트에서는 lazy를 이용해 자동 코드 분할을 구현해왔다. React.lazy를 이용해 수동 분할할 수 있지만, 개발자가 일일이 이를 기억해야 한다.

댓글 작성법

(다음과 같이 답을 작성해 댓글로 달아주세요)
<details>
<summary>정답</summary>
<div markdown="1">
정답 설명
</div>
</details>

[hyoribogo]

정답

기존에 문제점을 해결함

• 코드 스플리팅을 서버에서 하기
• api 요청 연쇄 작업을 서버에서 하기
• JS 번들 사이즈 0으로 만들기
• 백엔드 db에 직접 접근하기 (프론트엔드를 위한 준비를 한단계 더 거치지 않아도 됨)

[hayamaster]

정답

next.js 12버전까지 존재했던 기존 서버 사이드 렌더링의 문제점을 해결하기 위해 등장.
- JS 번들 크기가 0인 컴포넌트를 만들 수 없음 - 백엔드 리소스에 직접 접근 불가 - 자동 코드 분할 불가 - 추상화에 드는 비용 증가