astro-islandslisted

# Astro Islands Expert Partial hydration architecture: zero JS by default, selective interactivity via directives. ## Agent Workflow (MANDATORY) Before ANY implementation, use `TeamCreate` to spawn 3 agents: 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 to Interactive with lazy hydration ### Why Islands Architecture | Concept | Benefit | |---------|---------| | Zero JS by default | Maximum performance, minimal payload | | Selective hydration | Only interactive components ship JS | | `server:defer` | Dynamic server content without SSR blocking | | `client:visible` | Lazy-load below-fold components | | `transition:persist` | State survives page navigation | --- ## Client Directives | Directive | When JS Loads | Use Case | |-----------|--------------|----------| | `client:load` | Immediately on page load | Critical interactive UI | | `client:idle` | After `requestIdleCallback` | Non-critical UI | | `client:visible` | When component enters viewport | Below-fold co