Micro-frontends: A new term for an old thought
There are times when you have a concept in your mind, and you start to experiment with it. And then out of the blue, you get an article that exposes the knowledge of the elders. Then, your concept has a name and a community: Micro-frontends.
The approach I wish to examine will be semi-standalone to reduce the duplication of duplicate libraries. Micro-frontends apps that will have a wrapper to be able to live alone, and can be injected via requireJs to be used inside the bigger app. A simple POC, done with requireJs & Vue can be seen here.
There are still plenty of details to learn and check. Meanwhile, just to get into the consent, here are some articles:
The idea behind Micro Frontends is to think about a website or web app as a composition of features which are owned by independent teams. Each team has a distinct area of business or mission it cares about and specializes in. A team is cross-functional and develops its features end-to-end, from the database to user interface.
Single-spa is a javascript library that allows for many small applications to coexist in one single page application. This website is a demo application that shows off what single-spa can do. For more information about single-spa, go to the single-spa Github page. Additionally, this website’s code can be found at the single-spa-examples Github.
Luca Mezzalira: Adopting a Micro-frontends architecture:
· do we want multiple micro-frontends in the same view?
· how do we route between pages?
· how do we share data between micro-frontends?
· how do we generate our micro-frontends? Runtime or Compile time?
Cam Jackson: Micro Frontends:
there are no free lunches when it comes to software architecture – everything comes with a cost. Some micro frontend implementations can lead to duplication of dependencies, increasing the number of bytes our users must download. In addition, the dramatic increase in team autonomy can cause fragmentation in the way your teams work. Nonetheless, we believe that these risks can be managed, and that the benefits of micro frontends often outweigh the costs.
Some issues needs consideration:
- iframes / HTML injections / script injections
- Manage Versions of sub-apps
- Testing framework for each and all.
- Communication: bus / listeners / Veux …
- Duplication of dependencies
- Fully standalone version
- State manager
- …
This post had been published before time to allow me to share the concept (post) with others. So forgive if it’s uncut.