Hybrid, the common case

01 Handing state to the browser Render the state the browser needs into the page once, as a window object or a JSON island, and treat it as authoritative instead of fetching it again. The template in both engines, the module that reads it, and the three rules that keep it safe.

02 One client module, carrying the CSRF token The CSRF token, the base URL and the headers live in one module, and every request goes through it. The module, where the token comes from on cached and uncached pages, and the failure it prevents: some requests answering 403 while others work.

03 Dynamic fragments The pattern that keeps a personal page cacheable: a fragment template that switches caching off, a page layout that serves fragments by name, and a script that fetches them after the cached page has painted. The whole mechanism, in both engines, and how to check it works.

04 The three things that always need a fragment Sign-in state, the cart count and personalised blocks: why each one breaks a cached page in its own way, and the cart count as a fragment from end to end. Put these three in fragments in the first sprint and the rest of the site can stay cached.

05 A personalisation bundle that loads only when it is on Gate a whole JavaScript bundle on a site setting, so visitors download it only when the feature is switched on; let the bundle announce itself with an event; and fetch the personalised block as a fragment whose parameters reach the cache key.

06 What must work without JavaScript Decide, per site, what must still work when JavaScript does not run (usually navigation, content and form submission), and test it with a procedure rather than a principle. What a hybrid site gets for free here, and the two places it usually fails.

07 Splitting bundles An island on a landing page should not pull the checkout's JavaScript in with it. One webpack entry per part of the site, each loaded only by the templates that need it, and a size budget that fails the build when an entry grows.

Objects ReferenceGenerated from the platform, so it is always current

API ReferenceEvery REST endpoint, in cURL, PHP, Python and JavaScript

In this unit