deeplink-hydration
Installation
SKILL.md
Deep-link hydration survival
A deep link is a contract: the URL alone must reconstruct the screen. SPAs break this
contract during the window between document load and router hydration, when the
router's state lags the real URL. If this page renders inside a native WebView, see
webview-bridge-pages; this skill owns plain-SPA router/param readiness only.
The failure mode
- Next.js pages router: statically optimized pages render first with an empty
router.query— it's only populated after hydration triggers an update (Next.js docs: Automatic Static Optimization).router.isReadyis the flag, usable only client-side (useEffect). - Any logic that runs on first render — redirects, fallbacks, analytics, "param missing → go home" guards — sees the empty state and acts on it. The user followed a valid deep link and still lands on the default screen.