Angular › Angular Elements (Web Components)

What is the difference between using Angular Elements and building a full micro frontend architecture?

Intermediate

Answer

Angular Elements are best suited for embedding one specific, self contained piece of functionality, like a widget or a small form, into another page or application. A full micro frontend architecture typically involves composing several larger, independently deployed applications together, often using more advanced tools designed specifically for that larger scale composition.

// Angular Element, a small self contained widget
<feedback-widget></feedback-widget>

// Micro frontend, an entire independently deployed application section
// loaded and composed using a dedicated micro frontend tool

Real-world example A company uses Angular Elements for a small, reusable star rating widget embedded across many different pages, while using a proper micro frontend approach for combining their much larger, separately developed checkout and catalog applications.

Common follow-ups: At what point does a project outgrow Angular Elements and need a full micro frontend approach instead?;Can Angular Elements be used as one piece inside a larger micro frontend architecture?

Micro Frontends with Angular;Standalone Components