Application Patterns

  • Single Page Application (SPA): Apps that run entirely in the browser

  • Multi-Page Application (MPA): Apps that run entirely on the server, with minimal client-side dynamic behavior

  • Static Site Generation (SSG): Pre-rendered static content, with or without a client-side dynamic element

  • Server-Side Rendering (SSR): Dynamically rendering HTML content on the server before rehydrating it on the client

  • Partial Hydration: Only hydrating some of your components on the client (e.g. React Server Components)

  • Progressive Hydration: Controlling the order of component hydration on the client

  • Islands Architecture: Isolated islands of dynamic behavior with multiple entry points in an otherwise static site (Astro, Eleventy)

  • Progressive Enhancement: Making sure an app is functional even without JavaScript

  • Incremental Static Generation: Being able to dynamically augment or modify a static site even after the initial build (Next.js ISR, Gatsby DSG)

  • Streaming SSR: Breaking down server-rendered content in smaller streamed chunks

  • Resumability: Serializing framework state on the server so the client can resume execution with no duplicated code execution.

  • Edge Rendering: Altering rendered HTML at the edge before sending it on to the client

Reference:

  1. https://2022.stateofjs.com/en-US/usage/#js_app_patterns