Overview

After SSR HTML lands, the shell injects buildHydratingBootScript() so window.__MATES_IS_HYDRATING__ is true before deferred client JS runs.

Client boot calls armHydrationGrace() (default 100 ms) to clear the flag once modules have started — so a slow download cannot expire the window early.

Stores check isHydrating(): with a snapshot they apply and skip load(); without a snapshot they only load() when not hydrating.

Simulate hydration grace

Set the window flag, arm an 80ms grace, then re-read isHydrating().

import { html, atom, renderApp, isHydrating, armHydrationGrace, MATES_IS_HYDRATING_KEY } from 'mates';

const App = () => {
const flag = atom(isHydrating());

const simulate = () => {
window[MATES_IS_HYDRATING_KEY] = true;
flag.set(true);
armHydrationGrace(80);
setTimeout(() => flag.set(isHydrating()), 100);
};

return () => html`
<div class="m-col m-gap">
<p class="muted">isHydrating() = ${String(flag())}</p>
<button class="btn-primary" @click=${simulate}>
Simulate boot script + armHydrationGrace(80)
</button>
</div>
`;
};
renderApp(App, document.getElementById('app'));