번들링(bundling) 도구란? 왜 필요하냐?

모듈 관리
- 현대 프론트엔드 애플리케이션은 여러개의 자바스크립트 파일과 라이브러리로 구성된다.
- 번들러는 이 파일들을 하나의 번들로 묶어 관리하기 쉽게 만들어준다.
- 이를 통해 의존성 관리가 용이해지고, 특정 파일이나 모듈이 누락될 위험이 줄게 된다.
성능 최적화
- 번들러는 자바스크립트 파일을 병합하고 압축하여 파일 크기를 줄인다.
- 이를 통해서 네트워크 요청 수를 줄이고, 로딩 시간을 단축시켜 애플리케이션 성능을 향상 시킨다.
- 코드스플릿팅을 통해 필요할 때만 특정 코드 조각을 로드 할 수 있도록 설정가능하여, 초기 로드 시간을 줄일 수 있다.
호환성 및 트랜스파일링
- 최신 자바스크립트 기능,혹은 타입스크립트를 사용 할 경우 번들러는 바벨 등의 도구와 함께 사용되어 ES5등의 버전으로 변환하는 트랜스 파일링 작업을 해준다.
- CSS 전처리기와의 통합도 가능하여, 스타일시트를 효율적으로 관리할 수 있다.
개발 편의성
- 번들러는 핫 모듈 리플레이스먼트 (HMR)기능을 제공하여, 코드 변경 시에 페이지를 새로고침하지 않고도 실시간으로 변경사항을 반영할 수 있다. 이를 통해 개발 생산성을 크게 향상 시킬 수 있다.
- 소스맵을 지원하여 디버깅이 쉽다.