sky4me presents

Astro: The New Frontend King in the AI Era

The SPA-by-default era is ending. Here is the case for a new default.

01 Part One

The default got heavy

How the frontend default drifted

We made the SPA the default for sites that were never apps.
Every marketing page now ships a full client-side framework.
Hydration re-runs on the client what the server already rendered.
The user downloads, parses, and executes JavaScript to read text.

The king is heavy.

the incumbent's real cost

/ What slow costs you

Speed is revenue, and JS is the tax

1 %

more conversions per 100ms faster (Mobify)

7 %

more conversions from 850ms faster (COOK)

10 %

of users lost per extra second (BBC)

02 Part Two

The momentum is real

/ Adoption

This is not a niche experiment

60K+

GitHub stars (Jul 2026)

15M

npm downloads / month

77M

npm downloads / last year

Weekly downloads: 322K to 3.7M

322K Jan '25

918K Dec '25

1.48M Mar '26

3.74M Jul '26

Who already ships on Astro

IKEA, Porsche, and Unilever run it in production.
Netlify and Cloudflare build their own sites on it.
Microsoft's Fluent 2 and Google's Firebase docs are Astro case studies.
Mattel and Garmin are among 2026's newest adopters.

State of JS 2024: usage rose 4th to 2nd, behind only Next.js

Developers who tried it, kept it

#1

Interest

#1

Retention

#1

Positivity

Astro won the web.

developer sentiment, not just hype

03 Part Three

Zero JS by default

Islands architecture, in one screen

Components render to HTML and CSS. No client JS is shipped.
You opt a component in with a client directive, or you do not.
Hydrate on load, on idle, or on visible: your call, per island.
A component the user never sees never costs them a byte.

What a build actually ships

astro buildcompiling components to static HTML + CSS0 KB JavaScript shipped for static contentinteractive islands deferred to client:visibleHTML-first, JavaScript strictly on demandevery byte of JS is opt-in, not the default

Source: Astro, 2023 (CrUX / HTTPArchive real-user data)

It shows up in real-user data

50%+

of Astro sites pass Google Core Web Vitals

40.5 %

web-wide average across all sites tested

#1

only major framework above the 50% line

Ship less. Do more.

the whole philosophy in three words

04 Part Four

Content at build time

Content is data, typed and compiled

Content Collections have been first-class since Astro 2.0.
Frontmatter is validated by Zod, with TypeScript types generated for you.
The Astro 5 Content Layer loads Markdown, a CMS, or any API through loaders.
Server Islands mix cached static HTML with per-request dynamic parts.

Broken content fails the build, not production

// src/content.config.tsdefineCollection({ schema: z.object({ ... }) })frontmatter validated at build timeper-collection TypeScript types auto-generateda typo in metadata stops CI, never reaches a userthis deck's own slides are validated exactly this way

Runtime CMS versus build-time content

The SPA + headless CMS way

Content is fetched and assembled on every request.

A database or API call sits in the hot path
Cache invalidation is now your problem
A CMS outage is a site outage

The Astro way

Content compiles into static HTML once, in CI.

No runtime database in the request path
Broken content is caught before deploy
The CDN serves plain files, globally

05 Part Five

Composition, not lock-in

Bring the framework you already know

Official islands for React, Preact, Svelte, Vue, Solid, and Alpine.
You can even mix several of them on a single page.
Svelte 5 runs today through the @astrojs/svelte integration.
Tailwind drops in natively, no config file required.

The right tool for each part of the page

Astro components

The static shell of the page.

Layout, content, and markup
Zero JavaScript by default
Rendered once, at build time

Svelte or React islands

The parts that actually move.

Menus, forms, interactive widgets
Hydrated only when needed
Compiler-thin, scoped to the island

We lowered development costs by over 50% with Astro's Starlight.

WP Engine

Astro case study

06 Part Six

Built for the AI era

Why static-first fits the AI web

Astro renders plain, crawlable HTML: exactly what agents read best.
Content is typed Markdown, clean input for any AI pipeline.
Astro ships an official MCP server so agents get current docs, not guesses.
There is official guidance for building Astro sites with AI tools.

Plain HTML wins.

what crawlers and agents actually consume

The framework meets the agent halfway

// an AI agent needs current Astro docsconnect: https://mcp.docs.astro.build/mcplive framework docs, not hallucinated APIspages ship as static, crawlable HTMLbuild-time content = clean context for LLMsthe AI era rewards sites that are just readable

07 Part Seven

The honest part

let's not lie to win

Next.js is still the bigger kingdom

175M

Next.js npm downloads / month

15M

Astro npm downloads / month

11x

Next.js is still bigger by raw installs

By raw installs, still the challenger

175M/mo Next.js

15M/mo Astro

8 %

Astro's install share today

Next.js

Astro, and climbing

The caveats a skeptic will raise, said first

The headline CWV study is Astro's own, and it is roughly three years old.
Older frameworks are dragged down by a long tail of legacy versions.
Next has the bigger hiring pool and app-heavy ecosystem, today.
App shells with heavy client state are still Next or SPA territory.

Default, not dogma.

the claim is about the default, not everything

So which do you reach for?

Reach for Astro when

The page is content, and speed is the product.

Marketing, docs, blog, or commerce front
SEO and load time decide the outcome
Mostly static, with interactive islands

Reach for Next / SPA when

The page is an application, not a document.

Dashboards and heavy client-side state
Real-time, per-request personalization everywhere
The app shell is the product

08 Part Eight

The proof is this page

You are looking at the argument

This deck's site is built on Astro 5.
Every slide is a type-safe YAML content collection.
The interactive chrome is Svelte 5 islands, nothing more.
Styling is Tailwind 4, and static slides ship zero JavaScript.

sky4me's own build (first-party)

What that buys in practice

98+

Lighthouse performance scores

40 %

less JavaScript than an equivalent React build

0

Node processes running on the server

From commit to production, no runtime

pnpm buildAstro compiles to static HTML in CIdist/ rsynced to the VPSCaddy serves static files, HTTP/3 + auto HTTPSzero Node runtime in productionthe whole site is, in the end, just files

The new default.

for the content-driven, AI-era web

Rethink your default

Your next site does not need a runtime

sky4me builds Astro-first: fast, content-driven, and AI-ready by construction.

Talk to sky4me about your build