Framework Freedom with Micro Frontends

on YouTube ↗25m

" summary

Freshworks replaces iframe integration with client-side composition using single-spa and a root config that registers micro frontends by name, bundle URL and activation rule, relying on lifecycle hooks bootstrap, mount, unmount to lazy load Ember and React bundles (including Ember 3.4 and 3.8 alongside React). The system works but surfaces concrete problems: unified URL asset resolution, synchronizing independent blue-green deployments, sharing a design system and React versions, and coordinating cross-app communication so framework freedom carries ongoing operational cost.

AI-written summary · about

" chapters (9)

1. 0:00Introduction
2. 2:29Business shift to unified experience
3. 4:33Why micro frontends
4. 9:08Building micro frontends
5. 13:23How single-spa works
6. 17:13Real-world implementation
7. 19:20Challenges with micro frontends
8. 21:45Types of micro frontends
9. 23:37Conclusion and trade-offs

" related talks

• 36mMicro Frontends in Action!Peter Eijgermans · Voxxed Days Brussels 2023
• 45mMicro Frontends in Action!Peter Eijgermans · Voxxed Days Luxembourg 2023
• 24mScaling Frontend Development using Micro-frontendsMashhood Rastgar · NG-MY 2019
• 57mMicro Frontends – a strive for fully verticalized systemsDavid Leitner · NDC London 2020
• 46mScaling Micro-Frontends with Custom ElementsFrank Borkin · Build Stuff 2022
• 34mIntroduction to Micro FrontendsIvan Jovanovic · OdessaJS 2018
• 37mIntroduction to Micro FrontendsIvan Jovanovic · The Rolling Scopes Conference 2018
• 36mMicro Frontends - Breaking MonolithsBipul Kumar · Developer Summit 2020