Playground

Playground

Working demos of every part of the region model, running on this docs site as real csr = false island shells. Each page is honest: it does exactly what it says, and the JS-off toggles let you see the static HTML underneath.

Start with strategies Read the docs
hydrate

Strategies

load, idle, visible, media, and a named preset — each a live island with a JS-off toggle so you can see the static HTML the server shipped.

Open demo →defer

Server islands

Deferred holes fetched on four schedules, a visible hole below the fold, and cookie personalization rendered on the server.

Open demo →hydrate: 'none'

Lakes

A frozen region inside an interactive island, remount cache vs SWR revalidate, and an island that wakes up again inside a lake.

Open demo →.remote.ts

Data & remotes

query seeded from SSR, command + refresh, a live SSE clock, batched queries, and a remote form() guestbook.

Open demo →OgygiaRouter

Router

SPA swaps with view transitions, data-ogygia-persist chrome that keeps islands mounted, prefetch attributes, plus an MPA handoff.

Open demo →await import()

Client-only lazy mount

Host island dynamically imports a plain Svelte component on click — regular child, not a second island. import() + with { hydrate } stays a build error.

Open demo →ogygia 0.4

Portable bindings

Marked imports are values — stash them in a dictionary or barrel, pick one with ?widget=, render with <Active />. Controls stay a separate island with serializable props only.

Open demo →dev warning

Mutation guard

Captured host state is a one-way snapshot. Mutating it in an island is a no-op the dev runtime warns about.

Open demo →