CommonJS와 ES Module의 차이점

자바스크립트에서 모듈을 관리하고 불러오는 두 가지 주요 방식

CommonJS
Node.js환경에서 사용, 모듈을 동기적으로 불러옴
모듈이 로드될 때까지 다음 코드가 실행되지 않는 방식
require 키워드를 사용해 모듈을 가져오고, module.exports를 통해 내보냄
주로 서버측에서 사용 됐지만, 클라이언트 환경에서도 번들러를 통해 사용 가능

ES Module은 자바스크립트의 공식 표준 모듈 시스템
ECMAScript 2015(ES6)부터 도입
브라우저와 Node.js 환경 모두 사용할 수 있음, 모듈을 비동기적으로 로드
모듈 가져올 땐 import 키워드를 사용, 내보낼 땐 export 사용
정적 분석이 가능해, 트리 쉐이킹과 같은 최적화 작업에도 유리

즉, CommonJS는 동기적, 서버측 많이 사용
ESM은 비동기적, 브라우저와 서버 모두 사용

최근 Node.js에서도 ESM 사용이 증가하는 추세

트리 쉐이킹이란
사용되지 않는 코드를 제거하여 번들 크기를 줄이는 최적화 기법