Micro frontends: Building In Public From Scratch - Part2 - when to use Microfrontends ?
Tags: microfronten, angular, vue, react
Published: 2023-08-11 10:08:41

Today, I decided to explore when it's a good idea to use micro frontends in projects. I usually only try new tech when I'm really sure it's worth it. So, I've started looking into it, and here's what I found. I want to help you all understand when micro frontends could be useful. Whether you're a technical architect, developer, or project manager, this information could prove to be invaluable. It can serve as a significant factor in decision-making processes.


Lets get started . No dull moments – just action-packed content.

Microfrontends work great for complex sites - but how do you know if your site complexity demands them?"

Just to remind you about Microforntend architecture , let me share few examples again. 

## Example 1: Office Building
Think of constructing a huge office building - you wouldn't try to build the entire massive structure as one giant block.



![Building](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bdtr8xx0pip4nsxecwlf.png)



Instead, you separate it into smaller wings and floors that focus on specific functions. Then you integrate these pieces together into the final building.

Similarly, microfrontends split up a large web application into smaller, focused components.


Each microfrontend acts as its own wing or floor, specialized for its job. But they integrate together seamlessly into the full application building.

Constructing a massive office complex using separate wings makes sense - it allows focused specialization and independent workstreams.

Similarly, microfrontends excel when building complex web apps with:

- Many complex features and large development teams
- Ability to break the product into specialized domains
- Need for agility on specific features without coordination overhead

However, for constructing a small office building, building separate wings may be over-engineering it.

Likewise, microfrontends may be overkill for:

- Smaller, simpler web applications and teams
- Apps where shared state and tight integration needs outweigh benefits
- Products where consistent UX is more critical than independent features

In these cases, a traditional monolithic architecture may be preferable to avoid the overhead and complexity of microfrontends.

##Example 2 :Dinner

Let's say you're cooking dinner. For a simple meal with just a main dish, doing everything in one pot or pan is easiest.


![Dinner Analogy Example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/25pqxuwk0i1vly9t3wti.png)


But for a super elaborate 5-course meal, you likely need multiple pots, pans, and utensils working in parallel!

Similarly, apps with lots of features and traffic often benefit from microfrontends:

Many features = multiple pots
Large teams = multiple cooks
Divide and conquer complexity
But how big is "big enough"? 

## Some sizing guidelines:

5+ development teams
10+ major site features
500k+ monthly site visitors

So in summary:

Simple app and team = one pot
Complex app and team = multiple micro-pots

Evaluate if your app has grown big and complex enough to justify adopting microfrontends. They really shine for elaborate 5-course meal sites!

## Key points : 
**When To Use Microfrontends**
_Best use cases:_
	

- Very large, complex frontend applications
- Many autonomous teams and business domains
- Rapid innovation needed on specific features
- App already using component architecture

**When Not To Use**
_Avoid microfrontends if:_
    
- App is relatively small and simple
- Heavy shared state and data coupling
- Strong UI/UX consistency required across features
- Team is unfamiliar with modular architecture


## Pros and Cons

**Pros:**
- Focused team ownership
- Technology flexibility
- Independent deployments
- Scaling team size

**Cons:**
- Added complexity
- Integration challenges
- Partial UI inconsistencies
- Repeated shared code

> Next part of this series will be based on following topics :
> **_Setting expectations for incrementally transitioning to microfrontends_**


Please like, follow, and share this post if you found it valuable. The more we can spread the word, the better we can collectively advance the state of web architecture.

I appreciate you coming along for the ride! 
Stay tuned! 

Connect me on [Linkedin](https://www.linkedin.com/in/lakin-mohapatra/), [Twitter](https://twitter.com/lakincoder), [Instagram](https://www.instagram.com/lakin_codes/)