Dehydrate & Hydrate
StateMesh supports full state serialization and restoration. Use this for SSR, testing, cache transfer, and app restore.
Full Mesh Dehydrate/Hydrate
ts
// Snapshot everything
const snapshot = mesh.dehydrate({
forms: true,
resources: true,
queuedMutations: true
});
// Restore everything
mesh.hydrate(snapshot, {
mergeState: true,
resources: true,
queuedMutations: true
});Resource Cache Only
ts
// Snapshot resource cache
const snapshot = mesh.dehydrateResources({ tags: [{ type: "products" }] });
// Restore on client
mesh.hydrateResources(window.__STATEMESH_RESOURCES__);SSR Pattern
ts
// Server
const mesh = createMesh({ state: { /* ... */ } });
const snapshot = mesh.dehydrate();
res.send(`
<div id="root">${renderToString(<App mesh={mesh} />)}</div>
<script>window.__STATEMESH__ = ${JSON.stringify(snapshot)}</script>
`);
// Client
const mesh = createMesh({ state: { /* ... */ } });
mesh.hydrate(window.__STATEMESH__);
hydrateRoot(document.getElementById("root"), <App mesh={mesh} />);Important Notes
TIP
Dehydrate returns a plain JSON-serializable object. It can be stored in localStorage, sent over the network, or embedded in HTML.
WARNING
Always validate and sanitize deserialized data before hydrating. Use the same version/migration checks as persistence.
Next Steps
- Persistence — Automatic persistence
- DevTools — DevTools snapshot API
