View Transitions: Persisting Arbitrary Client‑Side State Across Navigations
0 reputation · 02 Feb 2026, 08:34 UTC
Goal
In a site built with Astro’s ClientRouter (formerly ViewTransitions), I need to keep the scroll position of nested containers and arbitrary JavaScript state that lives outside of islands alive when the user navigates between pages using the client‑side router.
Constraints
Astro’s transition:persist attribute only preserves DOM elements that match by ID or class across the two pages; it does not automatically restore scroll offsets or non‑island state. The astro:page-load lifecycle event can re‑hydrate islands, but there is no documented hook for restoring generic state or scroll positions. Third‑party scripts that assume a full page load also need manual re‑initialization, which can lead to memory‑leak‑like symptoms if left dangling.
Unresolved Questions
- What is the recommended pattern for preserving scroll positions of nested containers when using Astro View Transitions?
- How can ad‑hoc JavaScript state that is not part of an island be reliably restored after a client‑side navigation?
- Is there an officially endorsed approach—such as a helper API, external store, or lifecycle event—that centralizes state persistence across Astro navigations?
astro