Conceptos

Micro Frontends

Patrón arquitectónico que extiende los microservicios al frontend, permitiendo que equipos independientes desarrollen y desplieguen partes de una aplicación web de forma autónoma.

seed#micro-frontends#architecture#react#module-federation#frontend

¿Qué es?

Micro frontends extienden el concepto de microservicios al frontend. En lugar de un monolito frontend, la aplicación se compone de fragmentos independientes desarrollados por equipos autónomos, integrados en runtime o build time.

Estrategias de integración

EstrategiaIntegraciónEjemplo
Build-timenpm packagesMonorepo con packages
Runtime (JS)Module FederationWebpack/Vite MF
Runtime (iframe)iframesLegacy integration
Server-sideSSI/ESIEdge composition

Module Federation

La técnica más popular: cada micro frontend expone módulos que otros pueden consumir en runtime, sin necesidad de rebuild.

Cuándo usar

  • Múltiples equipos trabajando en el mismo producto
  • Necesidad de despliegues independientes por sección
  • Migración gradual de tecnologías
  • Aplicaciones enterprise grandes

Cuándo NO usar

  • Equipo pequeño (un solo equipo)
  • Aplicación simple
  • Cuando la complejidad de integración supera el beneficio

¿Por qué importa?

Los micro-frontends aplican los principios de microservicios al frontend, permitiendo que equipos independientes desarrollen, desplieguen y escalen partes de la interfaz de forma autónoma. Son la solución cuando un monolito frontend se convierte en cuello de botella organizacional.

Referencias

Conceptos