Micro frontend links and thoughts

January 19, 2023 *

Micro frontend reading:

Micro frontend w/ Vue 3 and Vite:

Micro frontends are the future. Module federation is a method of deploying JavaScript code that will greatly assist in ushering in this brave new world.

I've been working for about a year on a large JavaScript application that would be embedded inside another legacy application. We developed the application in isolation because it was easier to move quickly and try things in a standalone site.

The legacy host application has a consistent release schedule, so we need to build a JS package, publish to an npm repository and pull it into the host application in time for the release. In order to do that, we need to stop development work on the standalone site a couple days before the host application's release to allow QA to test how the package looked in the host application's dev environment.

If all that goes well, then the host application moves to test, then prod, with the embedded application locked at a particular version. This is the main issue with the "publishing a library" method of deploying an app within an app.

Enter module federation. Module federation allows a team to deploy their JavaScript code to a static assets folder, then a host application can consume that JavaScript code at runtime meaning the code is always up to date.

Architecturally, this has so many benefits.

  • We are no longer tied to the host application's release schedule
  • No more publishing packages
  • Updates are immediately reflected

More to come on this ...