코드 스플리팅, Code Splitting (속도 높히기)

* 환경 : vue-cli 4.x 버전을 사용한 환경이며 vue2 입니다.

 

./router/router.js파일을 만들어 페이지 별 view를 import 하여 띄어준다.

 

보통 라우터에서 모든  views에서 파일을 import 하여 가져와 실행한다.

rank import

component에 등록

그러면 view에서 전부 import해야해서 브라우저에서 다운받는 속도가 느려진다 해결하기위해 코드 스플리팅을 한다. 

 

* 코드 스플리팅 : 페이지 수가 많은 사이트 일 때 한번 유저가 전체 앱을 다운 받으면 속도가 느려져 사용유저의 불편함이 생기기 때문에 url에 접속시 페이지를 다운 받아 사용하도록 하는 기술

 

방법 : import를 위에서 따로 해주지않고 component에서 바로 해주어 유저가 접속하는것만 import하게 해준다.

rank