[React] 리액트 lazy loading
2023. 5. 26. 20:51
프로그래밍/React
리액트 컴포넌트 lazy loading 방법 lazy loading은 로딩을 바로 하지 않고 지연시켰다가 로딩한다는 의미로 페이지에 그 부분이 보여져야 할 때 로딩하기에 처음 화면을 띄울때 속도를 개선할 수 있음 지연 로딩에는 여러 방법이 있지만 React.lazy 를 활용한 방법을 알아보고자 함 예시 fallback에는 로딩 중일 때 실행될 요소를 넣어줌 import React, { lazy, Suspense } from 'react'; const MyComponent = lazy(() => import('./MyComponent')); function App() { return ( Lazy Loading Example ); }