JavaScript Congress • Nov 23, 2021

Micro-frontends anti-patterns

Are your micro-frontends actually a distributed monolith? Uncover the architectural anti-patterns that bloat technical debt, and learn how to enforce team autonomy without triggering dependency hell.

Pause

Mute

Enter Fullscreen

#1 about 4 min

History and evolution of micro-frontends

The shift from early experiments at companies like Zalando to widespread industry adoption.

#2 about 4 min

Primary benefits of micro-frontend architectures

How independent deployments and decentralized decision-making accelerate delivery and empower engineering teams.

#3 about 5 min

Distinguishing between micro-frontends and ui components

Micro-frontends encapsulate entire business subdomains independently whereas components rely entirely on contextual property injection.

#4 about 3 min

Avoiding the multi-framework micro-frontend approach

Mixing UI frameworks inside a single page application should remain a temporary workaround for legacy migrations or acquisitions.

#5 about 4 min

Isolating legacy code with anti-corruption layers

Using sandboxing boundaries like iframes prevents dependency clashes when adopting modern micro-frontend orchestrators.

#6 about 5 min

Managing shared dependencies across isolated teams

Relying on extensive core libraries creates tight governance bottlenecks and cascades breaking changes across loosely coupled features.

#7 about 4 min

Implementing unidirectional data flows across boundaries

Bidirectional data sharing between application parts complicates debugging and encourages brittle integrations between modules.

#8 about 4 min

Preventing organizational coupling via global state

Sharing global state across disparate modules forces continuous cross-team synchronization during development and test automation pipelines.

#9 about 5 min

Optimizing backend calls to prevent self-ddos

Multiple independent frontends calling identical APIs forces redundant authorization checks and unnecessary backend scaling pressure.

#10 about 14 min

Answering questions on micro-frontend adoption and tooling

Strategies for monolithic code extraction, evaluating module federation versus SystemJS, and valid iframe use cases.

Matching moments

4:51 min

Differentiating domain-aware micro-frontends from UI components

Luca Mezzalira

Luca Mezzalira · World Congress 2022

3:55 min

Introduction to micro frontends and architectural consequences

Manfred Steyer

Manfred Steyer · World Congress 2021

1:26 min

Introduction to micro frontends and platform architecture

Florian Rappl · LIVE

1:31 min

Recapping frontend scaling patterns and distributed UI techniques

Josh Goldberg · World Congress 2021

2:13 min

Transitioning monolithic page structures to distributed front-end architectures

Luca Mezzalira

Luca Mezzalira · World Congress 2024

4:28 min

Understanding the engineering benefits of micro-frontend architectures

Luca Mezzalira

Luca Mezzalira · World Congress 2022

More from JavaScript Congress

The Eternal Sunshine of the Zero Build Pipeline thumbnail

almost 5 years ago

The Eternal Sunshine of the Zero Build Pipeline

Teini - an extremely small webshop leveraging awesome and free tech thumbnail

almost 5 years ago

Teini - an extremely small webshop leveraging awesome and free tech

Christian K

Native Web Apps: Are We There Yet? thumbnail

almost 5 years ago

Native Web Apps: Are We There Yet?

Maxim Salnikov

Modern Web Development with Nuxt3 thumbnail

almost 5 years ago

Modern Web Development with Nuxt3

Alexander Lichter

Making neural networks portable with ONNX thumbnail

almost 5 years ago

Making neural networks portable with ONNX

Ron Dagdag

JavaScript the Grumpy Parts thumbnail

almost 5 years ago

JavaScript the Grumpy Parts

Rob Richardson

Upcoming sessions on this topic

World Congress 2026 North America

September 25, 2026 · 10:20–10:50

Outdoor Stage

MicroAgents: The Microservices of the Agentic Era

Ashish Shubham

Runs the show bussiness at ThoughtSpot

Ashish Shubham

World Congress 2026 North America

September 25, 2026 · 09:40–10:10

Stage 3

Still on 4.8 or lower? A Practical Guide to Moving Your "Un-Migratable" .NET Apps

Isaac Levin

Developer Advocate

Isaac Levin

World Congress 2026 North America

September 25, 2026 · 12:20–12:50

Stage 9

Designing APIs That Survive AI Agents at Scale

Phani Pendurthi

Mastercard, Principal Software Engineer

Phani Pendurthi

World Congress 2026 North America

September 25, 2026 · 12:55–13:25

Stage 9

It’s Alive! Taming the MLOps Franken-Stack: Write, Run, and Serve with Michelangelo

Eric Wang, Paul Zimmerman

Eric Wang

Paul Zimmerman

World Congress 2026 North America

September 24, 2026 · 14:10–14:40

Stage 9

One Repo, One Strategy: Scalable Full-Stack Testing in a Monorepo World

Bartosz Leczycki, Paweł Matynia

Bartosz Leczycki

Paweł Matynia

World Congress 2026 North America

September 25, 2026 · 15:30–15:40

Outdoor Stage

Offloading IoT State: Solving the Memory Crisis on Legacy Hardware

Pravin Nagare

Senior Software Engineer, Roku

Pravin Nagare

Related videos

Micro-frontends anti-patterns thumbnail

World Congress 2022 • about 4 years ago

Micro-frontends anti-patterns

Luca Mezzalira

Microfrontends: Lessons Learned from Growing a Design System and Shared Libraries Across 20+ teams thumbnail

World Congress 2026 Europe • 2 months ago

Microfrontends: Lessons Learned from Growing a Design System and Shared Libraries Across 20+ teams

Erasmo Hernandez

Microfrontends at Scale thumbnail

World Congress 2021 • about 5 years ago

Microfrontends at Scale

Josh Goldberg

Front-End Micro Apps thumbnail

LIVE • over 5 years ago

Front-End Micro Apps

Serg Hospodarets

Destructuring Frontend monoliths with MicroFrontends thumbnail

JS Congress • almost 5 years ago

Destructuring Frontend monoliths with MicroFrontends

Trishul Goel

Advanced Micro Frontends: Multi-Version and Multi-Framework Scenarios thumbnail

World Congress 2025 • about 1 year ago

Advanced Micro Frontends: Multi-Version and Multi-Framework Scenarios

Manfred Steyer

Related articles

BB

Benedikt Bischof

Why You Shouldn’t Build a Microservice Architecture

Welcome to this issue of the WeAreDevelopers Live Talk series. This article recaps an interesting talk by Michael Eisenbart who talks about the pros and cons of microservice architecture.‍About the...

almost 4 years ago

Why You Shouldn’t Build a Microservice Architecture

DC

Daniel Cranney

How to Avoid Over-Engineering

In today’s software development world, the demand for designing applications that are both robust and easy to maintain is more pressing than ever. Many developers encounter the architectural chaos ...

over 1 year ago

A series of code blocks with 'X's on showing they are incorrect, with one CSS block shown as the correct answer.

CH

Chris Heilmann

Dev Digest 138 - Are you secure about this?

Hello there! This is the 2nd "out of the can" edition of 3 as I am on vacation in Greece eating lovely things on the beach. So, fewer news, but lots of great resources. Many around the topic of sec...

almost 2 years ago

Dev Digest 138 - Are you secure about this?

AA

Ali Alp

Why Event-Driven Architecture Isn’t About Speed (and When You Actually Need It)

Why Event-Driven Architecture Isn’t About Speed—And When You Actually Need It We’ve all seen it happen. An engineering team wants to feel like they belong in the “cool kids” club, so they grab Apac...

about 1 month ago

A developer workstation showing a code editor on one monitor, and a diagram on another

From learning to earning

Jobs that call for the skills explored in this talk.

Junior Frontend Engineer

Berlin, Germany

Starter €60k–75k NestJS ReactJS Backend

Frontend Engineer

Berlin, Germany

Expert €80k–140k NestJS ReactJS TypeScript

19 days ago • Verified

Staff Frontend Software Engineer

Expert Remote React JavaScript TypeScript

17 days ago • Verified

Founding Engineer (Front End)

San Francisco, United States

Expert €180k–220k React Next.js JavaScript

Frontend Engineer

Berlin, Germany

Starter €60k–75k NestJS ReactJS Backend

Mid/Senior Full-Stack Engineer (Web-first)

SMG Swiss Marketplace Group

Valbonne, France

Experienced Remote Kotlin Backend ReactJS