Micro Frontend Architecture Building an Extensible UI Platform by Erik Grijzen
Vložit
- čas přidán 6. 11. 2019
- At New Relic, we used a micro frontend architecture to migrate from several monolithic products applications to one single platform where our users have one unified experience.
This new platform UI is broken down into separate micro applications, views, and other extension points. This extensible way of building a platform allows us to reduce the toil for our development teams to work on new features and bring value to our customers much faster.
This new architecture was not only built for internal development but also allows third-party (customers) developers to extend our platform for their own special use cases. Based on our real-world experience going through this transition, we will take a look at the benefits that come with such an architecture, such as ease of deployments, increased team autonomy, localized complexity, and more.
There were also many challenges along the way and we will reflect on how we tackled some of the hardest problems we faced regarding performance, resiliency, UI consistency, scalability, and even organizational changes.
I'm a Lead Software Engineer with a focus on front-end technologies building platform UI @ New Relic. Web performance enthusiast and clean code lover ♥ - Věda a technologie
7:30 Our architecture
17:20 Our implementation
Well done :-)
Really helpful!!
We do need something similar. Is the AppShell Open Source? I am interested how you solved the composition into the shell application.
Well presented.
really good presentation.
Really great presentation! Do you see webpack federation and yarn workspace making these things easier?
Is the CLI ONLY designed for New Relic APM integration and building extensible UI ? I am interested in trying this out for a business application.
This is a great example on how it is done. I might move a bit on the team autonomy and take a bit of an initial hit on script loading to allow us to easily migrate UI frameworks as well as libraries which might be more difficult to do in a large company. Is there a chance that there is some sample code out there on GitHub for this project?
Is the nerdpack considered the micro-frontend package, or the nerdlet?
I think Web Components (LitElement) could play really nicely in this architecture because of encapsulation they provide.
I didn't really enjoy Lit Components. Nothing beats having components in the framework (Vue, react, Angular, etc.) you are writing the app with. Starts with autocomplete, ends with using framework like features (e.g. v-model).
Bit if user loaded the page he will not get any updated js & css 7ntil his browser be reopened, right?
Hello, the micro frontend must be applied for independent microservices, so if a micro front end has dependencies from another one it should be considered a bad case.....what about the User management microservices ??? all microservices depend on it because the user session is needed in all the next microservices....How to deal with the user management micro front end or this case is different ...Can someone please told us some explanation please ... And thank you very much
Hey,
1. Thanks a lot for this sharing
2. when you bundle a Nerdlet - do u bundle also other nerdlet or you have a sophisticated build mechanism for delta (changes)?
Thanks
How is that different from portlet architecture, which essentially does everything described in the talk?
It is not that different but it is native to the web platform. At the end of the day technology evolutions is not a straight line but a spiral where former ideas get revisited constantly
Stan Marsh is still searching for the CLI tool