[Next.js] Code Splitting
Next.js는 Webpack을 사용하여 JS, CSS, 이미지 등 모든 모듈을 효율적으로 번들링합니다.이렇게 번들된 코드는 브라우저가 빠르게 읽고 실행할 수 있습니다. 코드 분할(Code Splitting)을 통해 번들을 여러 조각(chunk)이나 컴포넌트 단위로 나누어,초기 페이지 로딩 시 꼭 필요한 코드만 내려받고 나머지는 필요할 때 불러올 수 있습니다. 이를 위해 Next.js에서는 dynamic import를 활용하여 특정 컴포넌트를 사용자가 필요로 할 때만 동적으로 불러올 수 있으며, 덕분에 초기 로딩 속도가 빨라지고 사용자 경험이 개선됩니다.const CodeSampleModal = dynamic(() => import('../components/CodeSampleModal'), { ssr..
