Islands and deployment
Start with zero JavaScript
Inspect an Astro page as HTML first and add client code only for behavior the browser must perform.
8 minute lesson
Astro components produce HTML without shipping a client runtime by default. A loop, conditional, or imported component can make a rich document while leaving no JavaScript for the visitor to execute.
Before adding client code, ask what behavior is actually missing. The browser already provides:
- links for navigation
- forms and built-in validation for data submission
<details>and<summary>for disclosures- audio and video controls
- CSS for responsive layout and many visual states
These features work before a bundle downloads, support browser conventions, and usually survive assistive technology better than a custom imitation.
Inspect a plain Astro page in the Network panel. Filter requests by JavaScript and confirm there is no framework runtime. Then add a <details> element and verify that it still opens and closes. Interactivity does not automatically mean JavaScript.
Use client code when the browser must hold changing state, respond to custom events, or call a browser-only API. Zero JavaScript is the starting point, not a contest: the goal is to make every shipped byte explain its purpose.
Lesson completed