Skip to Main Content
Learning JavaScript Design Patterns, 2nd Edition
book

Learning JavaScript Design Patterns, 2nd Edition

by Addy Osmani
April 2023
Intermediate to advanced content levelIntermediate to advanced
298 pages
6h 44m
English
O'Reilly Media, Inc.
Book available
Content preview from Learning JavaScript Design Patterns, 2nd Edition

Chapter 13. Rendering Patterns

As we moved to more interactive websites, the number of events handled and the amount of content rendered on the client side grew, resulting in SPAs rendered primarily on the client, as in the case of React.js.

However, web pages can be as static or dynamic as the function they serve. We continue to serve a lot of static content on the web, for example, blog/news pages that you can generate on the server and push as-is to the clients. Static content is stateless, does not fire events, and does not need rehydration after rendering. Conversely, dynamic content (buttons, filters, search bar) has to be rewired to its events after rendering. The DOM has to be regenerated on the client side (virtual DOM). This regeneration, rehydration, and event handling functions contribute to the JavaScript sent to the client.

A Rendering pattern provides the ideal solution for rendering content for a given use case. The Rendering patterns in this table are popular:

Rendering patterns

Client-side rendering (CSR)

HTML is rendered completely on the client

Server-side rendering (SSR)

Dynamically rendering HTML content on the server before rehydrating it on the client

Static rendering

Building a static site to render pages on the server at build time

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 into smaller streamed ...

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Start your free trial

You might also like

Modern JavaScript From The Beginning

Modern JavaScript From The Beginning

Brad Traversy
Node.js Design Patterns - Third Edition

Node.js Design Patterns - Third Edition

Mario Casciaro, Luciano Mammino

Publisher Resources

ISBN: 9781098139865Errata PageSupplemental Content