프론트엔드 개발, 마이크로프론트엔드로 혁신!

by DD
10개월 전
조회수 11

마이크로프론트엔드(MFE)SPA의 한계를 극복하고자 등장한 아키텍처 패턴이다.

빌드 타임런타임 통합 방식을 통해 독립적인 배포기술 스택 유연성을 확보한다.

Module Federation과 같은 기술을 활용하여 코드 분리팀 생산성 향상을 기대할 수 있다.

마이크로프론트엔드 아키텍처의 핵심 원리

마이크로프론트엔드는 MSA의 프론트엔드 버전으로, 독립적인 배포를 가능하게 한다. 구체적으로, 각 팀이 독립적인 기술 스택을 사용하여 개발하고 배포할 수 있다. 따라서 코드 격리를 통해 개발 생산성을 높이고, 유지보수성을 향상시킨다.

빌드 타임 vs 런타임 통합 방식 비교

빌드 타임 통합모노레포 또는 npm 패키지를 활용하여 코드 공유초기 로딩 성능을 높인다. 반면, 런타임 통합Module Federation을 통해 기술적 독립성을 보장하지만, 라이브러리 버전 충돌성능 저하의 위험이 있다. 따라서, 프로젝트 특성에 맞는 방식을 선택해야 한다.

마이크로프론트엔드 도입 시 고려사항

마이크로프론트엔드 도입 시, 팀 규모, 도메인 복잡성, 기술적 성숙도를 고려해야 한다. Module Federation 사용 시, 싱글톤 설정을 통해 라이브러리 버전 충돌을 방지해야 한다. 결과적으로, 점진적인 접근을 통해 성공적인 MFE 도입을 달성할 수 있다.

대규모 프론트엔드 아키텍처의 새로운 패러다임 - Part 1. 마이크로프론트엔드 너 뭐야?