DEV Community

Cover image for Short Overview: Micro-Frontends 🧩

Short Overview: Micro-Frontends 🧩

Marcos Silva on May 27, 2024

When people talk about Micro-Frontends, the first thing that they would mention is their amazing power to scale up. They achieve this by splitting ...
Collapse
 
mosesb profile image
Moses B • Edited

Microservices Architecture (Micro-Frontend included) are useful for big organisations like Netflix where you have multiple programming departments each working on a part of your system.
The overall system can be broken into microservices with each department almost independently managing their group of microservices. Sort of like working on your own piece 🧩 of a large puzzle. It'll be overwhelming for a single or few developers to handle so many puzzle pieces without something going wrong.

Collapse
 
m4rcxs profile image
Marcos Silva

Yeah! Netflix, Amazon and others.

The way that you can distribute your entire application into small pieces is overwhelming, however when we are talking about Micro Services its about large teams in different parts of the project working to the same purpose! In this model, communication is essential.

Collapse
 
nmitic profile image
Nikola Mitic • Edited

Hey great summarization.

Maybe it would be worth mentioning which kind of scale micro frontends are aiming to aid for.

Just like any other micro services MFE are not a tool to solve engineering problems but rather they are engineering solutions to organizational problems of scaling.

This is crucial to understand for anyone attempting to implement their web using micro services ( again, of any kind)

I have been a part of organizations which required MFE but would fail to see the benefits, worse than such I was also part of organizations which employs MFE for the sake of scaling its product offerings, which again is totally not what MFE are aiming to solve.

MFE brings a lot of challenges, I mean a LOT. They absolutely must be justified by organizational challenges of scaling in order for organization and users to actually benefit from it.

We should never forget MFE aim to streamline product development faster (in case where they are needed) if you as an engineer or product owner feel like you are being slowed down by the challenges MFE brings, it's a sign your organization made a mistake and you really didn't needed MFE to begin with.

Be brave and abandon the ship.

Right tool for the right job. I hope you don't mind me, I feel responsibility to share view after seing so many sometimes irreversible problems wrongly adopted MFE can bring.

Collapse
 
m4rcxs profile image
Marcos Silva

Good point! The way that microservices keep the other parts of the system working if a piece is compromised is a good way to escape problems like isolation and failures.

Collapse
 
getsetgopi profile image
GP

Our organization uses MFE, and it has helped us meet our needs. Although there are numerous ways to implement MFE, we chose to use Webpack Module Federation since it is incredibly easy to set up, requires no additional libraries, and performs flawlessly. The challenges in MFE include working together as a team to maintain the same set of libraries, sharing React.js state with other MFEs in the same application, having multiple libraries in the same application (e.g., React & Angular), and many more. With Webpack Mod Fed, we are unable to package CSS/SASS and ensure that the consuming project has all the required style sheets.

Collapse
 
s_p_ profile image
Satish Purohit

Great! you listed some changes which is great to be worked around for leaning phase. If possible can you please list some more it will help us to make local project and deal with these problems before going to prod.

Collapse
 
m4rcxs profile image
Marcos Silva

Good luck in your project!

Collapse
 
bblldave profile image
bblldave

Good overview of micro frontends. I believe MFEs present some issues when it comes to collaboration and UX consistency between apps. I feel like it allows teams to live in silos because they only need to focus on a small portion of the application. You mentioned clear communication channels and I like that approach, but that requires a ton of good documentation to ensure everything stays consistent. I lean towards a mono repo structure being a more effective approach to building frontends. It fixes some of the issues with dependencies and consistency. Have you ever used a mono repo?

Collapse
 
m4rcxs profile image
Marcos Silva

If you are working on a project alone, implementing microservices could be overwhelming.

Collapse
 
pachicodes profile image
Pachi 🥑

Great overview!

Collapse
 
m4rcxs profile image
Marcos Silva

Thank you Pachi!

Collapse
 
heyjmac profile image
J Mac

Great summary! I'm looking forward for the next ones! Luca's book is great

Collapse
 
m4rcxs profile image
Marcos Silva

Thank you!

Yes, everyday I learn something new while reading this book!

Collapse
 
rusandu_dewm_galhena profile image
Rusandu Galhena

Good Short Overview of Micro-Frontend

Collapse
 
m4rcxs profile image
Marcos Silva

Thank you Rusandu Galhena!