Concurrent Store

Rendering a store on the server

You will learn

This page is server-rendered. The figures below were in the HTML before any JavaScript ran — open the page source and they are there.

useSyncExternalStore throws during a server render unless you pass a third argument, getServerSnapshot, so every store library has to keep a second source of truth for the server. useStore takes no such argument. The value the store was created with already is the snapshot, and the client store is created from the same serialized state.

Press Sell one once the page says hydrated, and it carries on from the server’s figures. A mismatch would have been logged by React and this subtree replaced.

server HTML, not yet hydrated
useStore(store)this package
rendered bythe server23:30:54 UTC
orders1,284
revenue£62,916

The same numbers before and after hydration. No second snapshot was supplied for the server render.