Microfrontends at Scale

Is your monolithic frontend slowing you down? Learn how a microfrontend architecture can speed up deployments and empower teams to ship features independently.

#1about 4 minutes

Understanding the problems with monolithic frontend applications

Large, aging monolithic applications suffer from slow build times, increased complexity, and code degradation over time.

#2about 2 minutes

Solving monolith problems with a microfrontend architecture

Microfrontends split a large application into smaller, independent projects to enable faster, isolated builds and deployments.

#3about 3 minutes

Routing traffic to microfrontends with edge workers

Edge computing services like Cloudflare workers can efficiently route user requests to different frontend applications based on URL paths.

#4about 5 minutes

Choosing between client-side, SSR, and static generation

Microfrontends allow you to select the optimal rendering strategy—client-side, server-side rendering (SSR), or static site generation (SSG)—for each part of your application.

#5about 1 minute

Creating a cohesive user experience with design systems

A design system provides a collection of shared visual components and standards to ensure a consistent look and feel across all microfrontend applications.

#6about 5 minutes

Organizing UI components using the atomic design methodology

Atomic design provides a clear methodology for structuring a design system by breaking down interfaces into atoms, molecules, organisms, templates, and pages.

#7about 4 minutes

Best practices for documenting a design system

Effective design systems require thorough documentation, and tools like Storybook and TypeScript can create interactive and type-safe component libraries.

#8about 4 minutes

Q&A: Maintaining consistency and choosing frameworks

This Q&A covers the challenges of coordinating design system updates and recommends frameworks like Next.js for building hybrid SSR and SSG applications.

#9about 6 minutes

Q&A: Vertical splitting, horizontal splitting, and monorepos

This Q&A explores architectural choices like vertical splitting by page versus horizontal splitting by component and discusses the benefits and complexities of using a monorepo.

#10about 8 minutes

Q&A: Managing state, component logic, and versioning

This Q&A addresses how to handle versioning, populate complex components with data, encapsulate logic, and avoid sharing state directly between microfrontends.

From learning to earning

Jobs that call for the skills explored in this talk.