Migrating a site

Sparke keeps the JS context alive across navigations. Here's the one thing to audit – and how.

The one behavioural change Sparke introduces: it keeps the JS context alive across navigations instead of throwing it away on each page load. Audit any code that assumed every navigation is a brand-new page.

Migration checklist

  • Per-page inline scripts (analytics, init) don't re-run after a swap – move them into a sparke:after-swap listener (plus one initial call), or mark them data-sparke-rerun.
  • DOMContentLoaded / load fire only on the initial load, not on swaps.
  • Global state, timers and window/document listeners persist – reset them in after-swap if a page assumed a clean slate.
  • Listeners bound inside <main> are lost on swap – use event delegation or re-bind after each swap.

A reliable "on every page view" hook

One pattern that works for both Sparke swaps and full-reload fallbacks:

Every page viewjs
function onPageView(path) {
  /* analytics, etc. */
}

onPageView(location.pathname); // initial load + full-reload fallback
window.addEventListener("sparke:after-swap", (e) =>
  onPageView(new URL(e.detail.to).pathname)
); // every Sparke navigation

Start by adding Sparke to a content-heavy section first. Because it's progressive enhancement, you can roll it out page by page with zero risk.