> Markdown version of [/videos/420-micro-frontends-anti-patterns?t=273](https://www.wearedevelopers.com/videos/420-micro-frontends-anti-patterns?t=273). Every page supports `.md` or `Accept: text/markdown`. Links point to the HTML versions so they work for humans too. Agent guide: [/agents.md](https://www.wearedevelopers.com/agents.md). --- # Micro-frontends anti-patterns Luca Mezzalira warns that micro-frontends aren't a silver bullet. Discover the crippling architectural anti-patterns destroying your independent deployments, from global state coupling to broken domain boundaries. - **Speakers:** [Luca Mezzalira](https://www.wearedevelopers.com/@luca-mezzalira) - **Event:** World Congress 2022 - **Published:** June 15, 2022 - **Duration:** 40:17 - **URL:** https://www.wearedevelopers.com/videos/420-micro-frontends-anti-patterns ## Summary Luca Mezzalira contextualizes micro-frontends not as a technical silver bullet, but as a socio-technical architecture designed to scale continuous, independent deployments with an organization's structural size. By decentralizing decision-making, engineering teams can drastically reduce frontend cognitive load and safely confine their focus to distinct business sub-domains. However, scaling distributed systems inherently introduces friction if system autonomy is continuously compromised by common architectural anti-patterns. A primary pitfall is confusing components with micro-frontends: an overly configurable UI element like a smart button lacks true domain ownership, whereas a valid micro-frontend strictly governs a self-contained business capability. Many teams also mistakenly apply the multi-framework capability merely to provide developer freedom, rather than treating it as a strategic, temporary bridge for legacy integrations or post-acquisition technical debt. Coupling issues constantly undermine these distributed layouts; sharing global state across fragments or deploying bi-directional host-to-remote sharing enforces restrictive "design-time coupling." To ensure isolated deployment, teams must utilize predictable unidirectional data flows alongside loosely coupled publish-subscribe event emitters. When integrating older platforms, direct iframe dependencies quickly bloat application shell logic. Implementing an anti-corruption layer shields the broader ecosystem and ensures seamless, future-proof feature swappability. Over-fragmenting also severely degrades backends: multiple UI sections requesting the exact same API often indicate broken domain boundaries that incur massive, unnecessary scaling overhead. Technical leadership must guard system integrity by prioritizing composition over extensive deep-core inheritance, continually tracking these critical shifts through architectural decision records to ensure structural choices serve the actual user experience rather than abstract technical purity. **Keywords:** micro-frontends anti-patterns, domain-driven design sub-domains, anti-corruption layer integration, unidirectional data flow, publish-subscribe event communication, design-time coupling, frontend team cognitive load, multi-framework migration strategy, legacy system modularization, architectural decision records, composable frontend architecture, micro-frontends state management, mono-repo vs multi-repo trade-offs, cross-view event emitters, independent frontend deployments ## Chapters 1. **Understanding the engineering benefits of micro-frontend architectures** (00:05) — How incremental upgrades, decentralization, and reduced cognitive load empower scalable engineering teams. 1. **Differentiating domain-aware micro-frontends from UI components** (04:33) — Why micro-frontends must own their business domain rather than exposing large APIs like traditional reusable components. 1. **The architectural risk of a multi-framework integration approach** (09:25) — Why employing multiple user interface libraries should be reserved for legacy migrations rather than treated as a default architectural goal. 1. **Shielding legacy code with anti-corruption integration layers** (11:20) — Wrapping legacy interface inputs into an isolated layer protects the broader application shell from complex technical debt and tight integration coupling. 1. **Managing external dependency versioning and breaking code changes** (15:54) — Choosing composition over inheritance bypasses the operational risks and breaking API changes created by broadly sharing single core libraries. 1. **Avoiding tight coupling through strict unidirectional data flows** (20:02) — Implementing strictly unidirectional flows prevents the brittle testing conditions and unexpected regressions caused by bidirectional information sharing between host and remote. 1. **Preventing design-time coupling with decentralized global state execution** (23:11) — Replacing centralized global state execution with asynchronous publisher-subscriber patterns maintains the independent deployment stability of neighboring remotes. 1. **Mitigating redundant backend API calls across overlapping micro-frontends** (25:15) — Resolving redundant scaling bottlenecks when overlapping micro-frontend domains accidentally bombard backend microservices with identical data requests. 1. **Balancing architectural tradeoffs and long-term decision tracking documentation** (29:15) — Why logging engineering considerations into architectural decision records aligns long-term strategy while acknowledging immediate systemic tradeoffs. 1. **Evaluating inter-app communication mechanisms and monorepo structural limits** (32:55) — Providing structured approaches for routing ephemeral user session tokens, debating monorepo boundaries, and identifying when generic modularity solves architectural problems instead of micro-frontends. ## Related Moments - [Introduction to micro frontends and architectural consequences](https://www.wearedevelopers.com/videos/165-micro-frontends-with-module-federation-why-and-how) (from "Micro Frontends with Module Federation: Why and How?") - [Applying microfrontend patterns and data duplication bounds](https://www.wearedevelopers.com/videos/494-the-rise-of-reactive-microservices) (from "The Rise of Reactive Microservices") - [Evaluating architectural alternatives to multi-framework micro frontends](https://www.wearedevelopers.com/videos/1677-advanced-micro-frontends-multi-version-and-multi-framework-scenarios) (from "Advanced Micro Frontends: Multi-Version and Multi-Framework Scenarios") - [Combining micro frontends and the modular monolith pattern](https://www.wearedevelopers.com/videos/492-stairway-to-heaven-scaling-frontends-the-right-way) (from "Stairway to Heaven - Scaling Frontends the Right Way") - [Advantages of adopting micro frontend architectural patterns](https://www.wearedevelopers.com/videos/100153-microfrontends-lessons-learned-from-growing-a-design-system-and-shared-libraries-across-20-teams) (from "Microfrontends: Lessons Learned from Growing a Design System and Shared Libraries Across 20+ teams") - [Recapping frontend scaling patterns and distributed UI techniques](https://www.wearedevelopers.com/videos/236-microfrontends-at-scale) (from "Microfrontends at Scale") ## Related Articles - [Why You Shouldn’t Build a Microservice Architecture](https://www.wearedevelopers.com/magazine/118-why-you-shouldn-t-build-a-microservice-architecture) - [How to Avoid Over-Engineering](https://www.wearedevelopers.com/magazine/546-how-to-avoid-over-engineering) - [Why Event-Driven Architecture Isn’t About Speed (and When You Actually Need It)](https://www.wearedevelopers.com/magazine/745-why-event-driven-architecture-isn-t-about-speed-and-when-you-actually-need-it) - [Dev Digest 138 - Are you secure about this?](https://www.wearedevelopers.com/magazine/486-dev-digest-138-are-you-secure-about-this) ## Related Jobs - [Staff Frontend Engineer](https://www.wearedevelopers.com/jobs/48313-staff-frontend-engineer) at **SMG Swiss Marketplace Group** - [Junior Frontend Engineer](https://www.wearedevelopers.com/jobs/ext/1532351-junior-frontend-engineer) at **Almedia** - [Staff Frontend Engineer (Expert+/Lead equivalent) - Hybrid working model, 100%, Ho Chi Minh City](https://www.wearedevelopers.com/jobs/48314-staff-frontend-engineer-expert-lead-equivalent-hybrid-working-model-100-ho-chi-minh-city) at **SMG Swiss Marketplace Group** - [Mid/Senior Full-Stack Engineer (Web-first)](https://www.wearedevelopers.com/jobs/ext/1210833-mid-senior-full-stack-engineer-web-first) at **SMG Swiss Marketplace Group** - [Software Engineer Frontend (all genders welcome) in the field of Water Line Integrity Solutions](https://www.wearedevelopers.com/jobs/ext/127888-software-engineer-frontend-all-genders-welcome-in-the-field-of-water-line-integrity-solutions) at **Rosenxt Group** - [Senior Web Designer, Growth](https://www.wearedevelopers.com/jobs/ext/102722-senior-web-designer-growth) at **Intercom, Inc.**