islands-architecture

Partial hydration is an islands architecture strategy that delivers static content while selectively hydrating only interactive regions, reducing JavaScript payload and improving first paint on content-heavy pages.

To hydrate interactive islands, you mark specific interactive regions on your static pages and use a framework like Astro, Marko, or Eleventy to progressively hydrate those components on demand as needed.

Yes, islands architecture provides framework-agnostic guidance with implementation examples for Astro, Marko, and Eleventy to progressively hydrate isolated interactive components on mainly static pages.

Use partial hydration for content-heavy sites like marketing pages, documentation, and blogs that need fast first paint with sprinkles of interactivity, rather than shipping a full SPA bundle.

Traditional SSR often leads to heavy JavaScript bundles by hydrating the entire page on the client side, whereas islands architecture hydrates only interactive regions to reduce payload and improve performance.