웹팩의 등장배경

일반적으로 자바스크립트 파일을 HTML 파일에서 불러오면 변수들이 전역 범위를 갖고있기 때문에 복잡한 어플리케이션을 개발할 때 같은 이름으로 여러 변수를 선언할 가능성이 있다.

이처럼 파일 단위로 변수를 관리하고 싶을 때, 이전에는 AMD, Common.js와 같은 라이브러리로 해결해왔다.

이전부터 프론트엔드 개발을 할때 가장 많이 반복하는 작업은 텍스트 편집기에서 코드를 수정한 뒤 브라우저를 새로고침하는 일이다.

이외에도 웹 서비스를 개발하고 웹 서버에 배포할 때 아래와 같은 작업들을 해야 했다.

이러한 일들을 자동화해주는 도구들이 필요했다. 그래서 Grunt와 Gulp같은 도구들이 등장했다.

웹 개발에서 로딩 속도를 높이기 위해 많은 노력들을 하는데, 그 중 하나가 서버에 요청하는 파일의 숫자를 줄이는 일이다. 이를 위해 웹 테스크 매니저를 이용해 파일들을 압축하고 병합하는 작업들을 진행했다.

뿐만 아니라 초기 페이지 로딩 속도를 높이기 위해 필요한 자원들은 나중에 요청하는 레이지 로딩(Lazy Loading)이 등장했다.

웹팩은 기본적으로 필요한 자원은 미리 로딩하는 것이 아닌 그때그때 요청한다는 철학을 가지고있다.