Micro frontends is a design pattern that splits an application into multiple independently deployable frontend applications to reduce dependencies between teams and improve the speed of delivery. This approach can reduce execution and delivery risks like long cycle times and inconsistent user experiences. It allows for more autonomous teams and faster time to market. However, it also introduces some risks around broken user interfaces if components are not built consistently. Adopting a micro frontends approach requires buy-in from engineering leadership as well as change management to shift teams away from old habits.
SyndBuddy AI 2k Review 2024: Revolutionizing Content Syndication with AI
Максим Климишин "Що такого особливого у пропозиції вартості шаблону Micro Frontends?" OdessaJS'2021
1. What is so special about
Micro Frontends value
proposition?
Maksym
Klymyshyn
Summer. Sea. JavaScript.
2. ● 3 slides intro
● Execution & Delivery Risks
● Quality and Speed Impact on Value
Delivery
● Organization Architecture
● Change Management
Agenda
3. ● 2 years as Software Engineer
● 4 as technical co-founder
● 3 years as tech lead
● 5 years as a CTO of small startup
(Zakaz.ua)
● 3 years as Software Architect of
mid-size startup (Takeoff
Technologies)
● Now Director of Engineering at
Takeoff Technologies
About
7. A design pattern in which
app developers split the application into
multiple frontend apps, so that each
consequent app can be deployed
independently (Separation of Concerns*)
Architecture standpoint
*Separation of Concerns (SoC) – a design principle for separating a computer program into
distinct sections such that each section addresses a separate concern
8. A way to decouple teams while working
on the application UI to reduce
dependencies and boost speed of value
delivery
Execution standpoint
17. According to research paper “Trust determinants and outcomes in global B2B service”
Trust, Reliability and Customer
Orientation
● Overall Software Quality (or reliability)
responsible for 17% of the trust-building
with the client in B2B sector
● Customer Orientation (or speed of
customization delivery for particular
partner) responsible for 31%
● It’s 48% of trust-building!
18. It impacts NPS*
*NPS – Net promoter score, measures customer experience and predicts business growth
19. NPS impacts Churn Rate*
*Churn Rate - is the rate at which customers stop doing
business with an entity.
20. NPS impacts CRR
*CRR – Customer Retention Rate, the rate at which customers stay
with a business in a given period of time
23. Technical Strategy
● Less dependencies means more
autonomy for a team
● More autonomy means less coordination
between teams
● Less coordination means shorter Cycle
Time
● Shorter Cycle Time means faster Time to
Market*
*Time to Market or “TTM” are synonyms describing the period of time
it takes from initial idea to finished product
26. Enablement Team
● Develop infrastructure
for Micro Frontends
● Develop integration with
legacy software
● Maintain comprehensive
documentation to enable
others
27. ● Develop capability to add
micro-frontends into monolithic app
● It shouldn’t be ideal, it should work
● Make sure there’s buy-in from Product
organization
● Be careful with PoCs – don’t erode
trust by shipping low qual pieces
Integration with Monolith
32. Buy-in from
● Engineering Leadership – alignment
about approach, risks and value
● Teams – more autonomy [a.k.a.
freedom], less meetings
● Product organization – risks, value
and roadmap clearly articulated
● It’s not about consensus, it’s about
alignment
33. ● Find champion within a team and pair
program
● Make it part of the Definition of Done
● Prohibit old approach via Quality Gate
● Essentially, create an environment
where much easier to deliver will be
through MFT
Breaking old habits
35. ● Micro Frontends is a much broader
concept than just a design pattern
● Faster feedback loop impacts
motivation positively
● It enables teams to deliver with fewer
dependencies
● And it’s new shiny thing to try!
37. ● Using risk management in the front end of projects
● Things you should never do, Part 1
● Micro Frontends
● How to drive growth with eCommerce customer retention rate optimization
● Net promoter score guide
● NPS Scores and Churn
● Trust determinants and outcomes in global B2B service
● Your Team Structures Ain’t Working. Let’s Apply Team Topologies
● 64 Essential Testing Metrics for Measuring Quality Assurance Success
● 20+ User Experience (UX) Metrics & KPIs to Measure by Product Managers: From
Real User Monitoring to Usability, Engagement, Adoption and Retention
Materials