컴포넌트 코드들을 처음에 모두 정적으로 import하게 된다면 그 크기는 계속 커지게 된다. 이를 방지하기 위해, 실제 필요한 코드일 경우에만 import를 해줌으로써 번들 크기를 줄이는 방법을 ‘코드 스플리팅(code spliting)’이라고 한다. 서버 컴포넌트 전에는 React.lazy()를 이용하여 직접 코드를 스플리팅했다. React.lazy()는 컴포넌트를 지연 로딩하는 방법으로, 컴포넌트가 실제로 렌더링되기 전까지는 해당 모듈을 로드하지 않는다. React.lazy()는 동적 import를 사용하여 필요할 때만 모듈을 로드하며, 이를 통해 초기 로딩 시간을 줄이고, 애플리케이션 성능을 최적화할 수 있다. 다음은 서버 컴포넌트 이전 코드의 예시이다.import React, { Suspense,..
