astro-islands

<objective> Implements Astro's Islands Architecture: partial hydration via `client:load`, `client:idle`, `client:visible`, `client:media="(query)"`, and `client:only="framework"`, plus Server Islands via `server:defer` (with `slot="fallback"` placeholders) for personalized or auth-gated content rendered after initial page load without blocking SSR. Also covers `transition:persist` for preserving component state across View Transitions, and prop serialization rules for data crossing the server/client boundary. Does not cover installing the underlying UI framework itself (astro-integrations) or Server Actions used inside islands (astro-actions) — those are separate skills. </objective> # Astro Islands Expert Partial hydration architecture: zero JS by default, selective interactivity via directives. ## Agent Workflow (MANDATORY) Before ANY implementation, spawn 3 agents in parallel, one `Agent` call each with a `name`: 1. **fuse-ai-pilot:explore-codebase** - Analyze existing components and hydration patterns 2. **fuse-ai-pilot:research-expert** - Verify latest Islands docs via Context7/Exa 3. **mcp__context7__query-docs** - Get client directive and server:defer examples After implementation, run **fuse-ai-pilot:sniper** for validation. --- ## Overview ### When to Use - Adding interactive React/Vue/Svelte/Solid components to Astro pages - Deferring dynamic server content without blocking page load - Persisting component state during View Transitions - Optimizing Time t...