search

libero / publisher-micro-frontend-experiment

https://github.com/libero/publisher/issues/371
MIT License
0 stars 0 forks source link

Compare integration approaches #1

Open giorgiosironi opened 4 years ago

giorgiosironi commented 4 years ago

https://martinfowler.com/articles/micro-frontends.html#IntegrationApproaches codifies various option for integrating the microfrontends in a single user experience:

  1. server-side template composition
  2. ~build-time integration~ nope
  3. ~run-time integration via iframes~ nope
  4. run-time integration via JavaScript
  5. run-time integration via Web Components

Unlike in this experiment, all of these five approaches provide a container application that composes the microfrontends, and owns the <body> tag essentially. 4 is the most similar to what is used in this experiment, but stripped of the container application and with routing done on the server side.

4 and 5 are probably not viable because they require JavaScript on the client side, too.

giorgiosironi commented 4 years ago

The container application pattern has the same discovery problems an homepage would have, but it flips the header and footer problem as they are only called once at the top level rather than having to be integrated in each of the microfrontends.

giorgiosironi commented 4 years ago

https://medium.com/@areai51/microfrontends-an-approach-to-building-scalable-web-apps-e8678e2acdd6 makes a parallel with atomic design, suggesting Organisms as the decomposition level for microfrontend independent apps.

giorgiosironi commented 4 years ago

https://medium.com/@_rchaves_/building-microfrontends-part-ii-joining-apps-together-dfa1b6f17d3e has some magic performance optimizations such as rendering the microfrontends on the server, but flushing them continuously on the response so that the browser doesn't block on a blank page.