Lazy

[React] Lazy Loading과 코드 스플리팅

Lazy Loading React에서 Lazy Loading은 주로 Code Splitting을 위해 사용되는 기법이다. 이 기법을 통해 애플리케이션의 초기 로딩 시간을 줄이고, 성능을 향상시킬 수 있다. Lazy Loading의 주요 목표 특정 컴포넌트 또는 모듈을 실제로 필요할 때까지 로딩하지 않는 것 이렇게 함으로써 초기 페이지 로드에 필요한 코드 양을 불이고, 초기 로딩 성능을 개선할 수 있다. React 16.6 버전부터 React.lazy()와 Suspense를 사용하여 Lazy Loading을 쉽게 구현할 수 있게 되었다. 사용 방법 React.lazy(): 컴포넌트 외부에서 동적 import() 문법을 사용하여 컴포넌트를 로드하는 함수를 받아, 자동으로 컴포넌트를 Lazy Load한다. c..