리액트 React.lazy와 Suspense 사용하기

🎯 리액트 React.lazy와 Suspense란? 📝 React.lazy const SomeComponent = React.lazy(() => import('./SomeComponent')); const OtherComponent = React.lazy(() => import('./OtherComponent')); function MyComponent() { return ( ); } React.lazy()를 사용하면 동적으로 불러오는 컴포넌트를 정의할 수 있다. 번들의 크기를 줄이고, 초기 렌더링에서 사용되지 않는 컴포넌트를 불러오는 작업을 지연시킬 수 있다. React.lazy로 import 해준 컴포넌트는 반드시 Suspense의 자식으로 들어가야 한다. 📝 Suspense 특정 컴포넌트에서 사용되..