Tree-Shaking

나무를 흔들어서 죽은 나뭇잎을 떨어뜨리듯, 코드를 빌드할 때도 실재로 쓰지 않는 코드들을 제외 한다는 뜻.

Tree-Shaking 이란

• Webpack, Rollup 등 JS 모듈을 번들링할때 사용하지 않는 코드를 제거하여 최적하는 과정을 뜻한다.

필요성

• JS 파일이 늘어나면 늘어날 수록 요청 시에 네트워크 리소스 소모가 커지는 효과를 줄이기 위해서 필요하다.
• JS 파일의 실행시간이 증가되어 랜더링 또는 CPU에 영향을 줌으로 페이지 로드 시간이 늘어날 수 있음을 방지 하기 위해 필요하다

import / export

import _ from 'lodash';

• lodash를 예를 들어 모든 요소들을 impor하기 때문에 모든 리소스가 불러와진다.

import { map, filter } from 'lodash-es';

• 필요한 함수만 기능만 로드하여 불필요한 요스를 제외 시킨다.