As modern enterprise app development moves toward greater modularity, micro frontends have served to break up the frontend monolith. This has enabled enterprises to assemble teams with end-to-end control over particular business functions within the larger application.
This kind of isolation between the different business functions allows organizations to move with greater agility and empowers them to implement innovative ideas more quickly.
But for all the benefits that micro frontends offer, one major consideration you’ll need to make is how exactly these independent pieces of functionality will be assembled and composed into a single user experience in your app. There are a number of different options, and none of them is necessarily one-size fits all (though, as you’ll see, we have our own opinion about what works best within our organization).
Here are three common approaches to building and delivering micro frontends, with pros and cons for each.
An iframe, which is short for inline frame, is a component of an HTML element that allows you to embed a webpage within a webpage. They also serve as a common option for composing micro frontends. Notably, Spotify utilizes iframes for their micro frontend architecture to great success.
One of the strengths of iframes is their ability to provide independence and clear isolation from one micro frontend to another. And when your micro frontends are clearly independent, you’re more likely to fully enjoy the benefits they offer.
One of the challenges of using iframes is that they can make it difficult to integrate micro frontends with one another. They also lack flexibility, and they can be hard to route and link.
This method is highly flexible and enables your teams to utilize standard frameworks.
The downside is that it can be difficult to standardize your approach.
Furthermore, using SPAs for micro frontends is that they run a higher risk of tight coupling, which would wind up giving you a distributed monolith rather than a micro frontend architecture, robbing you of the benefits micro frontends provide. However, it depends on how large you make your single page applications and how you integrate them in the final application.
A third option for delivering micro frontends is by using web components, which enable you to create reusable custom elements. This is the method we use here at Entando to deliver our micro frontend applications.
One of the great benefits is that web components are open spec and well understood. They also offer you the ability to clearly define boundaries and contract driven communication.
The downside of web components is that this approach requires composition, so you’ll need a platform that gives you that composition, or you’ll need to build one yourself. It also requires some knowledge and some training to build.
When release cycles take months instead of weeks, your business is left unable to deliver modern online experiences. Development and deployment bottlenecks slow your ability to make application updates, keeping you from iterating and innovating. And outdated or clunky UX keeps you from winning customers over and retaining them.
So that’s why we created a platform to help you get your ideas to market faster.
Entando is the leading micro frontend platform for building enterprise web apps on Kubernetes. We want to change the way enterprises think about building their apps, sites, and portals in order to innovate more quickly.
With Entando, you can:
Entando is open source with available enterprise support and services. Begin developing on the platform today, and get a quote to see how our team can help your enterprise build better apps, sites, and portals--faster.
This white paper outlines how your organization can accelerate UX innovation by developing with micro frontends on Kubernetes, as well as how a micro frontend platform can help you execute this methodology more effectively.