공식문서 https://webpack.kr/concepts/module-federation/

하나의 앱을 독립적인 배포가 가능한 모듈 단위(Webpack의 경우 청크)로 나누어 브라우저 런타임에 결합하는 개념

<aside> 💡 webpack이 빌드할 때 각종 js, css, html, 이미지 등을 js로 번들링하고 그 단위를 모듈 / 청크라고 부른다.

</aside>

Micro Frontends의 기반 기술이다.

Apollo graphQL Federation으로부터 영감을 받아 JS에 적용한 개념이다. (https://www.youtube.com/watch?v=-ei6RqZilYI )

MFA 예시

Module Federation은 다음과 같은 문제를 해결하고자 등장하였다

• 빌드타임 통합은 느리고 비효율적이다. (모노레포의 한계)
  • A에서 수정이 일어나면 이를 사용하는 B,C 도 함께 재빌드해야함.
  • 따라서 독립적인 빌드/배포가 어려움
• 런타임 통합 방식(iframe)은 UI/UX 및 보안 문제가 있다.

Webpack 5 Module Federation Plugin 은

Module Federation 개념의 Webpack 버전 구현체이며 2020년에 릴리즈된 Webpack 5에 추가되었다.