react.lazy

코드 스플리팅 기술에 대해 알아보았다. SPA의 경우, 사용하지 않는 컴포넌트들도 처음에 모두 가져오기 때문에, 초기 페이지가 나타나는데 시간이 SSR 보다 오래 걸린다는 단점이 있다. 이를 해결하기 위한 방법 중 하나가 코드 스플리팅인데, import 를 동적으로 한다는 것으로 보면 될 것 같다. import('./SplitMe').then(result => result.default()); 자바스크립트에서는 위의 방식으로 진행할 수 있다. 리액트에서는 크게 두 가지 방법이 있는데, 클래스형 컴포넌트를 사용해서, state에 로드하는 것과 React.laze 와 Suspense 를 사용하는 것이다. 일단 클래스형 컴포넌트의 사용법은 아래와 같다. class App extends React.Compone..