번들러란 웹애플리케이션을 구성하는 모든 자원을 하나의 파일로 묶는 도구를 의미한다.

(CSS파일, JS파일, 이미지파일, 폰트파일 등등)

번들러를 사용하게 되면 아래와 같은 장점을 얻을 수 있다.

  1. 모듈 단위의 코드 작성
  2. 네트워크 병목 완화
  3. 웹 개발 작업 자동화

번들러의 종류로는 웹팩, Parcel, Browserify등이 있다.

module bundler

특정기능을 갖는 작은 단위 코드 를 모듈이라고 하는것처럼 특정 기능의 자원 모두를 모듈이라고 부릅니다. 비단 javascript뿐만 아니라 HTML,CSS,Images,FONT등이 모듈 이고, 수십 개의 JS파일을 하나 의 js파일로 압축, 축소하여 하나로 압축하기 때문에 서버와 여러번 통신하지 않고, 코드를 압축하고 최적화 했기 때문에 로딩속도도 높다.

Transpile

최신 버전으로 작성된 자바스크립트 코드를 하위 버전의 자바스크립트 코드로 변환시키는 과정이 필요하다.

compile은 한 언어로 작성된 코드를 다른 언어로 변환하는것을 의미한다. c 언어 → 어셈블리