How to preload component

하려는 것

dynamic import로 적절한 시기에 preload 하여 불필요한 스크립트 로드를 죄소화해보자

적절한 시기란

  • 버튼을 클릭 하기 전. 즉 버튼을 hover 했을 때 (로드할 스크립트 커서 생각보다 느리다면 비 추천)
  • 컴포넌트가 마운트 된 이후
  • 즉, 로딩을 최대한 늦추는 것이 목적

hover 되었을 때

onMouseEnter function

컴포넌트가 마운트 된 이후

useEffect(() => {
 // 여기서 dynamic import
}, [])