Counter island
data-island="counter"The server printed count: 7 in a JSON blob inside
the island. After hydration the number is live — but it never flashes from 0, because
the signal is seeded from that printed value.
7
Islands & hydration
The server renders this whole page. Only the regions marked
data-island become interactive — islands.js hydrates them
in place, reusing the server-rendered nodes, with no virtual DOM and no flicker. Each
island starts at the exact state the server printed. Read how it
works →
Static (server-only)
no JSThis region has no data-island. It is pure
server-rendered HTML and the hydration runtime leaves it completely alone. View source:
what the server sent is what you see.
Toggle island
data-island="toggle"This island reads its initial state from a
data-state attribute. The server said open: true, so the
panel is already visible on first paint and stays visible through hydration.
Visible. Shown only while the island's signal is true.