Nuxt vs Astro

Zero JS ships by default, nothing reaches the client unless you add an explicit client directive. Static HTML output is bare with no framework overhead.

Code splitting per route and prefetching are automatic, but Vue runtime ships on every page. Not lean by default.

Static-first output consistently achieves 95-100 Lighthouse scores without manual tuning. No client hydration cycle means minimal layout shift.

Achievable and common in production but not automatic. SSR removes render-blocking and @nuxt/image helps LCP, but intentional optimization is required to hit green consistently.

The Islands Architecture requires explicit opt-in for every interactive component. No accidental framework runtime reaches the browser.

Vue runtime (~34kb min+gzip) ships on every page. Server-only components and NuxtIsland reduce bundle size but require opt-in - the default is a fully hydrated Vue page.

The interactive cli scaffolds a working project in under 30 seconds, among the smoothest onboarding in the JS ecosystem.

The cli produces a working project in under a minute with TypeScript configured by default. Nuxt DevTools are included. Slightly more opinionated than others.

Built-in with zero config required. Frontmatter and .ts files have strong inference; occasional gaps appear in .astro template slot types.

Best-in-class for the Vue ecosystem. Auto-generated types for routes, typed responses, and auto-imported composables with full inference via Volar.

Vite-powered HMR is fast and responsive on typical projects. Very large content collections can slow the dev server as entry count grows.

Vite-based cold starts are fast but auto-import resolution and module system add overhead on larger projects. Changes to composables or config can trigger slow full reloads.

Error overlay improved substantially from v3 onward. Occasional cryptic errors appear with island hydration edge cases or adapter misconfigurations.

A persistent weak spot. SSR hydration mismatch errors surface as generic Vue warnings. Module conflicts produce cryptic build errors. Nuxt DevTools help at runtime but build-time errors remain hard.

Purpose-built as an SSG first. The Content Layer API in v5 unifies local files and remote data sources under a single type-safe schema.

nuxt generate with route crawling and per-route prerender works well for content sites. Dynamic routes requiring runtime data need explicit enumeration.

Solid with official adapters for Vercel, Netlify, Cloudflare Workers, Node, and Deno. Some adapter edge cases lag behind the mature SSG story.

Nitro is genuinely excellent - streaming SSR, edge rendering, server middleware, and runtime-agnostic output for Node, Bun, Deno, Cloudflare Workers, and Vercel Edge.

Per-route prerender flags and Server Islands allow component-level static or dynamic mixing in the same project. Best-in-class granularity.

The routeRules API in nuxt.config.ts is best-in-class. Individual routes can be prerendered, cached, SSR-disabled, or redirected all in one config file.

First-class official integrations with Sanity, Contentful, Storyblok, Prismic, and others. Content Layer API creates a unified type-safe interface for any remote source.

Strong ecosystem via Strapi, Storyblok, Sanity and Contentful modules, and the first-party Nuxt Content module with MDC syntax and built-in search.

Draft and preview mode exists but live-preview for non-technical editors is less polished than Next.js Draft Mode. Area of active improvement.

Nuxt Content includes live reload for local dev. Headless CMS preview modes are documented but require manual setup. Storyblok has the best Nuxt-specific preview integration.

File-based routing with dynamic routes, nested layouts, and a redirects config. No parallel or intercepting routes.

File-based routing via pages/, nested layouts, dynamic and catch-all segments, and NuxtLink prefetching are all solid. definePageMeta enables per-page middleware and layout rules.

Top-level await in frontmatter naturally avoids waterfalls for static builds. No built-in client-side fetch primitive - wire that in yourself inside islands.

useFetch, useAsyncData, and $fetch handle SSR/CSR data with deduplication and payload serialization. The mental model takes time to internalize but the implementations are solid.

Server endpoints handle simple APIs, form handling, and webhooks cleanly. Not a substitute for a dedicated backend in complex applications.

The server/api/ directory powered by Nitro is excellent. Typed handlers, all HTTP methods via filename convention, and edge function deployment are all first-class.

Content Collections and schema enforcement keep content codebases organized. The component model stays readable as the project grows.

Auto-imports, composables, and Nuxt Layers architecture scale well with teams. Auto-import magic can make it harder to trace where functions come from on large projects.

v3 to v4 to v5 migrations have been smooth with automated codemods and detailed guides. Consistently low upgrade pain compared to other frameworks.

Nuxt 2 to Nuxt 3 was a near-complete rewrite requiring different store, module API, and rendering engine. Within Nuxt 3 minor releases upgrades are smooth.

.astro files are HTML with a JavaScript frontmatter block. Any developer who knows HTML and basic JS can read and maintain them without deep framework knowledge.

Vue templates are readable but Nuxt auto-imports, the `#imports` virtual module, and server/ conventions require framework knowledge to navigate confidently.

Official adapters for Vercel, Netlify, Cloudflare, Node, Deno, and AWS Lambda. Static output deploys anywhere that hosts files with no platform lock-in.

Nitro presets cover Node, Bun, Deno, Cloudflare Workers/Pages, Vercel Edge, Netlify, AWS Lambda, Azure Functions, Render, and Railway. The most complete adapter system of any meta-framework.

Vite-powered builds are fast for typical sites. Very large sites with 10,000+ pages can slow without incremental build support, not yet available natively.

Vite-based production builds are fast. Type generation and Nitro bundling add overhead compared to plain Vite. A medium project typically builds in 30-90 seconds.

Static output means near-zero CDN costs at virtually any scale. SSR workloads are lightweight with no runtime framework overhead consuming compute.

Cloudflare Workers support via Nitro enables near-zero cost at scale for edge-rendered pages. Vue runtime size can approach the 1MB Workers script limit on feature-heavy apps.

Astro's designed target. Performance, SEO, CMS integration, and content workflow all converge here - the strongest framework choice for marketing and content sites.

Capable with nuxt generate and @nuxt/image but Vue runtime overhead and required optimization work puts it behind Astro for content-first sites. Well-suited when complex interactivity is needed.

Not designed for SPAs or complex stateful applications. Sharing state across islands requires external stores and the architecture resists app-like patterns.

Strong choice for complex interactive Vue applications. Full-stack via server/api/, Vue 3 composition API, Pinia, and hybrid rendering make it excellent for SaaS and dashboard products.

Individual interactive components work well as isolated islands. Complex coordinated interactivity creates friction because islands do not share a component tree.

Vue's Proxy-based reactivity system is excellent for complex UIs. The composable provides SSR-safe shared state. Minor footguns around accidental reactivity loss for developers new to Vue.