[React] lazy loading

컴포넌트를 라우트로 이동시킬때 초기에 컴포넌트를 다 받아오는것이 아닌

해당컴포넌트에서 route 를 불러올때만 임포트 시키도록 하는 레이지로딩 방식이다

 

사용할 컴포넌트를 React.lazy 에 담아서 변수로 받아온다

 

React 에서 제공하는 Suspense 를 이용해서 lazy 로 감싼 컴포넌트를 route element 에 넣는다

컴포넌트를 받아오는동안 fallback 을 이용해서 원하는 것을 화면에 노출시킬수있다