Go to homepage 2sh

frontend // stack

Half of our core: Astro ships almost no JavaScript, so the performance budget holds after launch.

Astro is half of our Storyblok + Astro core. We build content-driven platforms on Astro's island architecture with Storyblok visual editing wired in — static HTML by default, interactivity only where it earns its place.

Our core frontend — always paired with Storyblok; reach for Next.js only when the surface is app-like.

0 KB CLIENT JS
100
Astro Core Architecture

The web framework for content-driven platforms.

Static HTML by default. Interactive islands hydrate on demand. Sub-second mobile LCP and guaranteed zero-hydration baseline.

Initial JS0 KB
Mobile LCP< 0.6s
CWV Pass63%
NETWORK & COMPILATION AUDITPASSED
document (SSR / Static)12.4 KB (HTML)
runtime JS bundle0.0 KB (None)
client:idle island2.8 KB (Deferred)
Time to First Byte (TTFB)28 ms (Edge)
Interaction to Next Paint (INP)14 ms (Good)
Engine: Astro 7 + Tailwind 4Target: Cloudflare Edge

benefits

What the framework gives every content site by default.

(01)

Zero-JS HTML with isolated interactive islands

(02)

Typed Storyblok blok contracts wired to Astro layouts

(03)

Content collections validated at build time with TypeScript

(04)

View transitions plus WebP/AVIF images with lazy loading

(05)

Framework-agnostic islands with a Cloudflare deploy adapter

(06)

Surrogate-key edge caching with 95+ Lighthouse budgets in CI

performance

Maximum speed through radical efficiency. Load time decides business outcomes, so performance is the foundation, not a feature.

Empirical Benchmark Data

Real-World Core Web Vitals Pass Rates

% of sites with good CWV
AstroStudio Core
63%
WordPress
44%
Gatsby
42%
Next.js
27%
Nuxt
24%
% of real-world websites with good Core Web Vitals (Updated 2026-09-21)Source: HTTP Archive + Chrome UX Report, via seibert.group astro-framework reference
(01)
0 KBInitial runtime JS

no client-side javascript

Astro renders content pages as static HTML and CSS by default. Interactive islands load only where the page needs them.

(02)
< 0.8sTarget mobile LCP

fast core web vitals

The reference build targets mobile LCP below 0.8 seconds. Static output and optimized media keep rendering work predictable.

(03)
100%Crawlable HTML

crawlable html, instantly

Search crawlers receive complete HTML on the first request. Fast TTFB gets the page to them sooner.

(04)
2.3xMobile retention lift

mobile retention

Fast first paint gives paid visitors a chance to see the offer before they leave.

why we use it

(01) Zero-JS by default

Pages render to static HTML with no client runtime tax. Visitors on mid-range mobile get content in one round trip instead of hydrating a full SPA bundle, which keeps Largest Contentful Paint and Interaction to Next Paint inside budget.

(02) Islands where it earns them

Search, carts, sliders, and configurators mount as isolated islands while the rest of the page stays static HTML and CSS. Each island hydrates on its own terms — on viewport entry, on interaction, or for personalization — so one widget never taxes the whole page.

(03) Content collections that scale

Typed Markdown and headless CMS entries compile at build time with TypeScript validation. Thousand-page estates stay fast without a server per request, and editors get draft builds with visual preview instead of form-field guesswork.

(04) Edge-first rendering that holds

Static generation with server-side rendering where data demands it, plus surrogate-key edge caching and instant invalidation. Every template ships against a JS and LCP budget verified in CI, so launch-day scores survive real editorial traffic.

islands

Maximum performance through intelligent decoupling. The page stays static except where you explicitly allow interactivity.

The majority of the page ships as lightweight HTML from the server. Interactive modules hydrate selectively — on viewport entry, on interaction, or for personalization — while static regions never load JavaScript.

island-architecture.view
edge runtime

header

<Navigation client:load />

interactive islandclient:load

sidebar

static html

Pure HTML & CSS. Zero client runtime.

Payload0 KB JS

content & layout

<Article /> · Static server-rendered tree

static html
Main Thread Cost0 ms execution

image slider / filter

<Slider client:visible />

interactive islandclient:visible

footer

<Footer /> · Edge-cached markup

static html0 KB JS
Interactive Island (Selective Hydration)Hydrates independently using client:load, client:idle, or client:visible. Isolation prevents one heavy widget from blocking main-thread interactivity.
Static HTML Shell (0 KB JavaScript)Renders 100% to static HTML & CSS at build or edge cache time. Dispatched in the initial TCP packet with zero client hydration overhead.

the whole package

The framework surface we build on for modern content sites.

(01)Zero JS Baseline

zero javascript by default

Unused JavaScript is stripped automatically. Content arrives as pure HTML and CSS, loading instantly without client-side runtime tax unless an island opts in.

Client Payload0 KB
Typical SPA bundle~340 KB
Astro content page0 KB JS
(02)Zod & TypeScript

content collections

Organize and validate Markdown, MDX, and headless CMS entries with strict TypeScript schemas. Built for docs, blogs, and thousand-page publishing platforms.

src/content.config.tsTYPE-CHECKED
defineCollection({
loader: glob({ pattern: "**/*.mdx" }),
schema: z.object({ title: z.string() })
})
Build breaks immediately if editor breaks schema.
(03)Native Web API

view transitions

Morph elements across routes while preserving audio and video state.

State A/services
➔
Morph/services/edge
Persistent stateZero full-page flash
(04)Up to -87% Size

automated image optimization

Compile-time WebP/AVIF generation, automatic responsive srcset attributes, and enforced aspect ratios that guarantee Cumulative Layout Shift (CLS) = 0.

RAW PNG ASSET3600px · 487 KB
⚡️COMPILED AVIF/WEBP480px · 63 KB (-87%)
Enforced Aspect RatiosCLS = 0.000
(05)Multi-Framework

framework agnostic islands

Use React, Vue, Svelte, Solid, or Preact side-by-side in one codebase. Render complex UI libraries inside isolated islands without shipping them to static pages.

React
Vue
Svelte
Solid
Preact
Mixed in the same layout · isolated execution boundaries
(06)Edge Runtime

deploy anywhere

Our studio default is the Cloudflare edge adapter. Official adapters also target AWS, Vercel, Netlify, and standard Node.js servers from a single codebase.

Cloudflare
AWS
Vercel
Netlify
Node.js
Zero vendor lock-in · standard request/response primitives
(07)Strict Mode

typescript native

Out-of-the-box TypeScript support without extra tooling or config. Strict contracts govern frontmatter, components, layouts, and API routes end-to-end.

Component Props Interface
interface Props {
slug: string;
metrics: CoreWebVitals;
}
(08)Clean URLs

file-based routing

The filesystem directory structure defines your URL paths and server endpoints. Clean, intuitive, and completely free of routing boilerplate.

src/pages/index.astro➔ /
src/pages/stack/[slug].astro➔ /stack/:slug
src/pages/api/check.ts➔ /api/check
(09)Prefetch

instant page loads

Predictive prefetching fetches documents into browser cache before user clicks. Eliminates network delay for perceived zero-latency navigation.

Cursor Hover18ms TTFB Prefetched
User clicks at ~150msDocument ready in RAM
(10)Astro 5+ Feature

server islands

Embed personalized, dynamic slots inside static, edge-cached pages. The static shell renders instantly from edge cache while dynamic content streams in.

Static HTML ShellGlobal Edge Cache (HIT)
<UserCart server:defer />Streamed Dynamic

tradeoffs

Our default versus the common alternative, stated honestly.

dimension2shtraditional
JavaScript payloadZero-JS by default with isolated islandsFull SPA bundle shipped to every visitor
Rendering modelStatic-first with edge caching and instant invalidationPer-request SSR that collapses under traffic spikes
Content workflowEditor preview with typed schemas and draft buildsTheme fields and plugin shortcodes that resist custom design
When not AstroDashboards and logged-in product surfaces go to app frameworksOne framework forced onto marketing and product alike

Not sure Astro fits your estate?

In the audit we map your estate, model the cost of staying versus moving, and document the recommendation in writing.