8 Composition and universal rendering

 

This chapter covers:

  • Employing universal rendering in a micro frontends architecture
  • Applying server- and client-side composition in tandem to combine their benefits
  • Discovering how to leverage the server-side rendering (SSR) capabilities of modern JavaScript frameworks in a micro frontends context

In the last few chapters, we focused on various integration techniques and discussed their strengths and weaknesses. We grouped them into two categories: server-side and client-side. Integration on the server makes it possible to ship a page that loads quickly and adheres to the principles of progressive enhancement. Client-side integration enables building rich user interfaces where the page can react to user input instantly.

Broad framework support for universal rendering made building applications that run server- and client-side a lot easier for developers. But what do we need to do to integrate multiple universal applications into a big one?

Terminology: Universal, isomorphic, and SSR

The terms universal rendering,a Isomorphic JavaScript,b and server-side rendering (SSR) essentially refer to the same concept: Having a single code-base that makes it possible to render and update markup on the server and in the browser. Their meaning or perspective varies in detail. However, in this book, we’ll go with the term universal rendering.

a See Michael Jackson, “Universal JavaScript,” componentDidBlog, http://mng.bz/GVvR

8.1 Combining server- and client-side composition

8.1.1 SSI and Web Components

8.1.2 Contract between the teams

8.1.3 Other solutions

8.2 When does universal composition make sense?

8.2.1 Universal rendering with pure server-side composition

8.2.2 Increased complexity

8.2.3 Universal unified single-page app?

Summary

sitemap