Hydration Decision Logic
Archibald chooses between Hydration (reattaching to existing HTML) and Rendering (creating new DOM) based on the presence of the data-arc-hydrated attribute (the HYDRATION_MARKER constant from @archibald/core).
The Full Page Reload Lifecycle
Key Differences
| Feature | Hydrate Mode (SSR Success) | Render Mode (Client-Only / Fallback) |
|---|---|---|
| Initial HTML | Full meaningful markup | Empty shell or loading spinner |
| React Method | hydrateRoot(container, <App />) | createRoot(container).render(<App />) |
| Performance | Instant visibility, delayed interaction | Delayed visibility, instant interaction |
| Island Logic | Reuses DOM nodes, attaches listeners | Generates new DOM nodes |
| Trigger | data-arc-hydrated="false" found on root | Marker missing or set to "true" |