Astro Explained: Websites That Ship Less JavaScript

Introduction

Most modern frameworks (React, Vue, Svelte — all covered earlier) send JavaScript to the browser to build the page there. That works, but it makes pages heavier and slower, especially on content sites like blogs and documentation where most of the page never changes. Astro, released in 2021, flips the default: it builds your pages to plain HTML on the server at build time, and ships zero JavaScript to the browser unless you explicitly ask for an interactive piece. For content-heavy sites, that default is a genuine speed advantage.

Islands: interactivity only where you need it

Astro's core idea is islands architecture. A page is mostly static HTML, with interactive "islands" — a search box, a comment form, a chart — that hydrate (become interactive) independently. You can even write islands in different frameworks on the same page: a React island beside a Svelte island, with Astro as the shell. A basic Astro component looks familiar to anyone who knows HTML:

---
const title = "Hello, Astro";
const posts = ["First post", "Second post"];
---
<h1>{title}</h1>
<ul>
  {posts.map((post) => <li>{post}</li>)}
</ul>

The fenced section at the top runs at build time (fetch data, compute values); the markup below becomes HTML. Nothing in this example ships JavaScript to the browser — and that is the point: the page loads as fast as plain HTML, because it is plain HTML.

The honest trade

Astro's trade is its focus: it is superb for content sites — blogs, docs, marketing pages — and less suited to highly interactive apps like dashboards, where a framework like Next.js or SvelteKit (in the same family as the Next.js post) that hydrates the whole app fits better. Its ecosystem is also younger than React's or Vue's, so some integrations are newer. But for the kind of site this blog itself is — mostly content, with a few interactive pieces — Astro's zero-JavaScript default is the fastest path to a fast site.

Takeaway

Astro builds pages to HTML and ships zero JavaScript by default, adding interactivity only as isolated islands. For content sites, that default beats shipping a whole framework to the browser — and it is why Astro became the fast choice for blogs and docs so quickly.

Originally published at https://practicaldevblog.blogspot.com/2026/10/astro-explained-websites-that-ship-less.html