Content-first sites with frugal JS
SPA frameworks like Next.js/Nuxt ship hundreds of KB of JavaScript even for content-heavy pages (blog, docs, marketing) where JS brings little value. The concept of “islands architecture” (proposed by Katie Sylor-Miller and popularised by Jason Miller of Preact) is the opposite: generate static HTML with selectively-hydrated “islands” of interactivity.
Astro, founded by Fred Schott (ex-Google, Snowpack) in 2021, is the framework most faithful to this pattern. Version 1.0 is released on 9 August 2022. MIT licence.
Features
- Zero JS by default — generates pure HTML; JS only for explicitly interactive components
- Multi-framework — React, Vue, Svelte, Solid, Preact, Lit components in the same project
client:load,client:idle,client:visible,client:media— precise hydration directives- Content Collections — typed Markdown/MDX content management
- Views Transitions — native cross-page animations
- File-based routing
- SSG, SSR, Server Islands (2024)
Syntax
.astro files combine HTML template, TypeScript frontmatter script, scoped CSS:
---
const { title } = Astro.props;
const posts = await fetchPosts();
---
<html>
<head><title>{title}</title></head>
<body>
<h1>{title}</h1>
<ul>
{posts.map(p => <li><a href={p.url}>{p.title}</a></li>)}
</ul>
</body>
</html>JSX-like syntax coexists with pure HTML.
Practical use
Astro is ideal for:
- Blogs and documentation
- Marketing sites
- E-commerce catalog pages (with client islands for cart)
- Informational PA portals
- Portfolios
For highly interactive “app-shell” applications, Next.js/Remix remain more suitable.
In the Italian context
This very noze.it site is built with Astro 5. Numerous Italian teams adopt Astro between 2022-2024 to renew corporate sites, blogs, PA portals.
References: Astro 1.0 (9 August 2022). Fred Schott. Islands Architecture (Katie Sylor-Miller, Jason Miller 2020). MIT licence. Multi-framework support. Vite technical base. Content Collections from 2.x.