Menu
Home
People
Places
Arts
History
Plants & Animals
Science
Life & Culture
Technology
Reference.org
Micro frontend
open-in-new
<p>A micro frontend is an <a href="/facts/Architectural_pattern/GnN0z06K">architectural pattern</a> for web development, where independently developed <a href="/facts/Frontend_and_backend/QVUfH8gu">frontends</a> are composed into a greater whole. It is analogous to a <a href="/facts/Microservices/1zGcNFSj">microservices</a> approach but for <a href="/facts/Client-side/v7DVfjsH">client-side</a> <a href="/facts/Single-page_application/6zsdUkxD">single-page applications</a> written in <a href="/facts/JavaScript/XhhIIEsl">JavaScript</a>. It is a solution to de-<a href="/facts/Composition_(object-oriented_programming)/zWbRC9Jd">composition</a> and <a href="/facts/Routing/Ml6MVCaC">routing</a> for multiple front-end applications. </p><p>Micro frontends (MFE) can be built using the following approaches: </p> <ul><li>With tooling such as module federation or native federation</li> <li>With libraries such as <a href="https://single-spa.js.org/">Single-SPA</a> or frameworks such as <a href="https://www.piral.io/">Piral</a></li> <li>With <a href="/facts/Web_Components/zQzBNnef">Web Components</a></li> <li>With iframes</li></ul> <p>Companies that use micro frontends are <a href="/facts/Canonical_(company)/76WPw1uW">Canonical</a>, <a href="/facts/IKEA/qeEoe5Bl">IKEA</a>, <a href="/facts/Scania_AB/GooUkEzI">Scania AB</a>, <a href="/facts/Spotify/wsTSvDD8">Spotify</a>, etc. </p><p>For <a href="/facts/Webpack/XqBk3PQP">Webpack</a> this concept is referred to as module federation. </p>