[React-Native] Metro 자바스크립트 번들러에 대한 이해

 

개요

Metro는 메타에서 제공하는 React-Native용 자바스크립트 번들러입니다.

 

자바스크립트 번들러

번들러의 필요성과 역할

• 일반적으로 효율적인 유지 보수를 위해 여러 파일로 쪼개어 관리
• 여러 파일로 분기화된 프로젝트 내부에서 각 파일들은 import또는 require을 통해 상호 작용하도록 설계
• 그러나 클라이언트는 이를 이해할 수 없으며 이해할 수 있더라도 호환성 문제(다른 클라이언트가 동일하게 이해한다는 보장이 없음)
• 여러 파일로 쪼개서 관리하는 방식을 유지하며, 클라이언트 호환성을 보장하기 위해 번들러 사용
• 번들러는 프로젝트 내 여러 파일들의 상호 작용을 이해, 클라이언트 호환성을 보장하는 단일 자바스크립트 파일로 만들어 줌

 

Metro

React-Native용 번들러 Metro를 메타에서 제공

• 번들러를 통해 만들어진 단일 자바스크립트 파일을 자바스크립트 인터프리터 Hermes가 해석
• React-Native 앱 빌드 시 metro 자동 구동(metro 터미널 팝업), 이는 빌드 과정에서 번들러를 통해 최적화된 단일 자바스크립트 코드를 내장하는 과정이 포함되어 있기 때문

자바스크립트 인터프리터를 JSC(apple)에서 자체 Hermes으로 바꾸고, 번들러도 자체 Metro를 개발해서 사용하는 것 보면... React-Native팀에서 제 3기관에서 제공하는 모듈(써드파티 모듈)의 사용을 줄이는 방향으로 진행하는 것 같습니다.

 

출처

Metro | Metro

Does Binaries (native code) and JS bundle actually packed inside an executable file (APK) for targeted platform?