Webpack부터 Kubernetes까지 (2) - gulp와 webpack의 차이

- 이전 플젝에선 Webpack을 사용하다가 다음 회사에서 Kubernetes를 사용하게 됨에 따라 공부하던 와중 webpack을 근본적으로 왜 사용하게 됐을 까를 알기 위해 정리함. (이를 위해 앞의 1에서 stream에 대한 개념을 잡았다.)

 

<들어가기전 참고>

 

• task runners / package bundler와의 차이
  • Package Bundler : 종속성을 가진 어플리케이션 모듈을 정적인 소스로 재생산 
  • Task Runner : 반복 가능한 특정 작업들을 단순 자동화한 것
• 즉 소스들을 하나의 패키지화 하는 것이 Webpack이고 Gulp는 미리 정의해 놓은 어떠한 작업들 (배포, 테스트와 같은)을 자동화하여 실행하는 것임 

 

 <Gulp>

  - node.js 기반의 task runners로 자동화된 빌드 툴로 알면 된다. 이 때 node기반 빌드 툴이기 때문에 stream기반으로 하는 빌드 시스템으로 스트림을 이용해 데이터를 읽고 출력하며 처리한다. 

   - 특징 

• Task runner인 만큼 반복 가능한 작업들을 자동화시킨 것
• Javascript 테스트 실행 / js, css, html등의 자산 파일을 압축 
• 빠른 빌드 속도

   - 즉 개인 프로젝트로 작게 할 때는 구축하는데 오래걸리는  webpack보단 쉽고 빠른 gulp가 나을 수 있단 것이다. 

 

 <Webpack>

   - Package Bundler로 gulp가 task runners라는 것과 다르다. 그리고 의존성 관리 기능까지 webpack은 제공함으로써
      Webpack = Gulp + 의존성 관리 의 개념이 된 것 + 속도도 빠르다. 

   - 특징

• Loader를 통해 Javascript, Image file, CSS, SCSS 등과 같은 자산을 하나의 모듈로 취급
• Entry를 통해 별도의 Bundle을 생성 가능하고 생성된 Bundle에 대한 압축 및 난독화 옵션 제공
• 비동기 I/O와 다중 캐시 레벨을 사용하기 때문에 컴파일 속도가 빠르다
• CommonJS(nodejs)와 AMD(requires) 스펙 지원

   - 이러한 특징들 때문에 쉽고 배우기 빠른 Gulp에 비해 규모가 큰 프로젝트는 모든 모듈에 대한 종속성 관리가 이루어지지 않기 때문에 Webpack을 사용하는 것임