Next.js vs Remix vs Astro vs SvelteKit en 2026: La guía definitiva para elegir framework
Elegir un meta-framework en 2026 se siente como elegir facción en una guerra fría. Internet te dice que Next.js es bloated, Remix está muerto, Astro es solo para blogs y SvelteKit es demasiado nicho para producción. Todas esas opiniones están equivocadas, pero se solidificaron como identidad tribal para muchos devs.
Lo que realmente pasó en el último año: Cloudflare adquirió Astro en enero 2026, cambiando fundamentalmente su trayectoria. Next.js pasó de la versión 15 a la 16 — estabilizando Turbopack para builds de producción y llevando Partial Prerendering hacia disponibilidad general. Remix se fusionó con React Router v7 mientras simultáneamente reimagina Remix 3 como un framework batteries-included y sin bundler. SvelteKit maduró con el sistema de runes de Svelte 5 y empezó a ganar contratos enterprise.
El panorama no se simplificó. Se especializó. Y eso es buena noticia — porque significa que hay una respuesta genuinamente correcta para tu proyecto, si sabés qué buscar.
Esta guía cubre todo: arquitectura, estrategias de rendering, rendimiento, experiencia de desarrollo, madurez del ecosistema y deployment. Sin lealtad a ningún framework. Solo análisis técnico honesto.
La división arquitectónica
Antes de comparar features, hay que entender la diferencia fundamental entre estos frameworks. Se dividen en dos categorías según lo que optimizan:
Frameworks de aplicación (Next.js, Remix, SvelteKit)
Estos tres están hechos para aplicaciones web interactivas. Asumen que tus páginas van a tener formularios, autenticación, actualizaciones en tiempo real y estado de cliente complejo. Cada página potencialmente necesita JavaScript en runtime. La pregunta es cuánto y cuándo.
Frameworks de contenido (Astro)
Astro optimiza para un caso de uso fundamentalmente distinto: sitios web content-first donde la mayoría de las páginas son HTML estático. JavaScript es opt-in, no opt-out. El framework asume que la mayoría de tus páginas no necesitan interactividad, y las que sí solo la requieren en "islas" aisladas.
No es un juicio de valor, es una restricción de diseño. Intentar construir un dashboard SaaS en Astro es como usar un destornillador como martillo. Funciona, más o menos, pero peleás con la herramienta. Igualmente, armar un sitio de documentación en Next.js envía mucho más JavaScript del necesario.
La primera pregunta no es "¿cuál framework es mejor?" Es "¿qué estoy construyendo?"
Next.js 15 → 16: El incumbente
Next.js es el meta-framework React con mayor market share, la comunidad más grande y la reputación más polarizante. Next.js 15 salió en octubre 2024 y Next.js 16 en octubre 2025. En febrero 2026, es simultáneamente la opción más segura y la más debatida.
Qué cambió en 2025-2026
El ciclo Next.js 15 → 16 trajo cambios significativos:
- Partial Prerendering (PPR): Sirve una shell estática al instante, luego streamea contenido dinámico. Introducido como experimental en Next.js 14, siguió experimental en 15. En 16, está graduándose hacia disponibilidad general como parte de la iniciativa "Cache Components". El concepto es poderoso — velocidad SSG con flexibilidad SSR — pero todavía está madurando.
- React Compiler (Estable): Memoización automática. Adiós a los
useMemo,useCallbackyReact.memomanuales. - Turbopack (Estable para Producción): Turbopack se estabilizó para desarrollo en Next.js 15 (oct 2024), pasó por alpha (15.3), beta (15.4) y builds de producción opt-in (15.5). En Next.js 16, se convirtió en el bundler por defecto para dev y producción, reemplazando Webpack completamente.
- Server Actions (Estables): Mutaciones cliente → servidor estilo RPC sin API routes.
Arquitectura
El modelo de rendering de Next.js es el más complejo de los cuatro:
Request → Middleware → Route Handler
↓
┌─── Shell Estática (cacheada en edge)
│ ↓
│ Huecos Dinámicos (streameados desde servidor)
│ ↓
└──→ HTML completo + RSC Payload → Hydration en cliente
Modos de rendering disponibles: SSG, SSR, ISR, PPR (graduándose), CSR.
Esta flexibilidad es la mayor fortaleza de Next.js y su mayor fuente de confusión:
- Comportamiento de caché — El App Router tiene múltiples capas (Router Cache, Full Route Cache, Data Cache, Request Memoization) que no siempre son intuitivas.
- Límites servidor/cliente — Saber dónde poner
'use client'y entender las restricciones de serialización. - Sobrecarga mental — Cinco estrategias de rendering = cinco conjuntos de trade-offs.
Ejemplo de código: Data Fetching
// app/dashboard/page.tsx — Server Component (default) import { Suspense } from 'react'; import { RevenueChart } from './revenue-chart'; import { LatestInvoices } from './latest-invoices'; export default async function DashboardPage() { // Esto corre en el servidor, sin useEffect const stats = await fetchDashboardStats(); return ( <div> <h1>Dashboard</h1> <StatsCards data={stats} /> {/* Streamear contenido dinámico independientemente */} <Suspense fallback={<ChartSkeleton />}> <RevenueChart /> </Suspense> <Suspense fallback={<InvoicesSkeleton />}> <LatestInvoices /> </Suspense> </div> ); }
// app/dashboard/revenue-chart.tsx — También Server Component export async function RevenueChart() { // Cada Suspense boundary se resuelve independientemente const revenue = await fetchRevenueData(); return <Chart data={revenue} />; }
Los boundaries de Suspense permiten streaming — las partes estáticas llegan inmediato mientras los fetch pesados se resuelven independientemente.
Cuándo elegir Next.js
- Ya estás en React y querés el meta-framework más maduro.
- Necesitás máxima flexibilidad de rendering — SSG, SSR, ISR, PPR, CSR en un proyecto.
- La contratación de talento es prioridad — Next.js tiene el pool más grande.
- Respaldo enterprise importa — Vercel + React team = estabilidad a largo plazo.
Cuándo evitar Next.js
- Tu equipo no maneja bien la complejidad. El mental model del App Router es empinado.
- Estás construyendo un sitio de contenido. Astro será significativamente más rápido.
- Te preocupa la dependencia de Vercel. Las features de Vercel (Middleware, Edge, ISR) funcionan mejor en su plataforma.
Remix: El purista de web standards
Remix tomó un camino no convencional: lo que estaba planeado como Remix v3 se lanzó como React Router v7 en noviembre 2024. Si usás React Router v7 con sus features de framework habilitadas, efectivamente estás usando Remix. Fue confuso al principio, pero estratégicamente brillante — React Router es la librería de routing más usada en el ecosistema React.
Mientras tanto, el equipo original de Remix está construyendo Remix 3 como un proyecto separado y experimental — un framework "batteries-included, zero-dependencies, sin bundler" que incluso podría explorar alternativas más allá de React. Todavía es temprano, pero señala que la filosofía Remix está evolucionando más allá de ser solo un framework React.
Filosofía: Abrazar la plataforma
Remix cree que la plataforma web ya resolvió la mayoría de los problemas. Formularios, carga de datos, mutaciones, caché — todo tiene solución nativa.
Las apps de Remix tienden a ser:
- Más resilientes — Progressive enhancement significa que los flujos principales funcionan sin JavaScript.
- Más simples de razonar — Sin caché de cliente para invalidar, sin revalidación compleja.
- Más cercanas a HTTP — Entender Remix es entender la web.
Arquitectura
El modelo de datos de Remix es único entre estos frameworks:
Request del Browser
↓
Route Matching (Rutas Anidadas)
↓
┌─── Loader (GET) → Devuelve datos para rendering
│ o
└─── Action (POST/PUT/DELETE) → Procesa mutación, revalida loaders
↓
Servidor renderiza HTML con datos cargados
↓
Cliente hydrata + maneja navegaciones subsiguientes como SPA
Conceptos clave:
- Rutas anidadas con carga de datos en paralelo: Cada segmento de ruta tiene su propio loader. Al navegar, Remix los trae todos en paralelo — no secuencialmente como SSR tradicional.
- Revalidación automática: Después de un action (mutación), Remix re-ejecuta automáticamente todos los loaders de la página actual.
- Error Boundaries por ruta: Cada segmento puede tener su propio error boundary, evitando que un error en una sección rompa toda la página.
Ejemplo de código: CRUD completo
// app/routes/invoices.tsx import type { LoaderFunctionArgs, ActionFunctionArgs } from 'react-router'; import { useLoaderData, Form } from 'react-router'; export async function loader({ request }: LoaderFunctionArgs) { const url = new URL(request.url); const query = url.searchParams.get('q') || ''; const invoices = await db.invoice.findMany({ where: { title: { contains: query } }, }); return { invoices, query }; } export async function action({ request }: ActionFunctionArgs) { const formData = await request.formData(); const intent = formData.get('intent'); if (intent === 'delete') { await db.invoice.delete({ where: { id: formData.get('id') as string }, }); } if (intent === 'create') { await db.invoice.create({ data: { title: formData.get('title') as string, amount: Number(formData.get('amount')), }, }); } // Después del action, Remix re-ejecuta el loader automáticamente return null; } export default function Invoices() { const { invoices, query } = useLoaderData<typeof loader>(); return ( <div> {/* Esta búsqueda funciona SIN JavaScript */} <Form method="get"> <input name="q" defaultValue={query} placeholder="Buscar..." /> </Form> {invoices.map((invoice) => ( <div key={invoice.id}> <span>{invoice.title} — ${invoice.amount}</span> <Form method="post"> <input type="hidden" name="id" value={invoice.id} /> <button name="intent" value="delete">Eliminar</button> </Form> </div> ))} <Form method="post"> <input name="title" placeholder="Título" required /> <input name="amount" type="number" placeholder="Monto" required /> <button name="intent" value="create">Crear</button> </Form> </div> ); }
Sin useState, sin useEffect, sin llamadas fetch, sin estados de carga manuales. El flujo es request → loader → render → action → revalidar. Limpio.
Cuándo elegir Remix
- Valorás web standards y progressive enhancement.
- Construís apps centradas en formularios (admin panels, dashboards, CRUD intensivo).
- Querés modelos mentales más simples (sin capas de caché ni bordes RSC).
- Ya usás React Router. Migrar de React Router v7 a Remix es cambiar una config.
Cuándo evitar Remix
- Necesitás generación estática (SSG). Remix es server-first.
- Querés máximo soporte del ecosistema. La fusión con React Router v7 causó fragmentación.
- Necesitás ISR o PPR. El caché se maneja vía headers HTTP (poderoso pero más manual).
Astro: La revolución del rendimiento (ahora con Cloudflare)
La historia de Astro en 2026 se define por un titular: Cloudflare adquirió Astro en enero 2026. No es solo inversión — es un cambio fundamental. Astro ahora tiene acceso directo a la infraestructura edge de Cloudflare, y la integración ya está saliendo.
La arquitectura de islas
La innovación core de Astro es de simplicidad radical: cero JavaScript por defecto.
SPA Tradicional:
[Shell JavaScript] → [Hydrata Todo] → [Interactivo]
~200-500KB JS mínimo
Astro:
[HTML Estático] → [Islas interactivas hydratan independientemente]
~0KB JS base + solo lo que las islas necesitan
Cada página de Astro es HTML estático por defecto. Cuando necesitás interactividad, creás una "isla" — un componente aislado que hydrata independientemente. Incluso controlás cuándo hydrata:
--- // src/pages/blog/[slug].astro import BaseLayout from '../../layouts/BaseLayout.astro'; import TableOfContents from '../../components/TableOfContents.tsx'; import CommentsSection from '../../components/CommentsSection.tsx'; import ShareButtons from '../../components/ShareButtons.svelte'; import { getEntry } from 'astro:content'; const { slug } = Astro.params; const post = await getEntry('blog', slug); const { Content } = await post.render(); --- <BaseLayout title={post.data.title}> <article> <h1>{post.data.title}</h1> <!-- Hydrata inmediatamente — para tracking de scroll --> <TableOfContents client:load /> <!-- HTML estático — sin JS para el cuerpo del artículo --> <Content /> <!-- Hydrata cuando es visible — ahorra recursos --> <CommentsSection client:visible /> <!-- Hydrata cuando el browser está idle — baja prioridad --> <ShareButtons client:idle /> </article> </BaseLayout>
Directivas de hydration:
client:load— Hydrata inmediatamente al cargar la páginaclient:idle— Hydrata cuando el browser está idleclient:visible— Hydrata cuando el componente entra al viewportclient:media— Hydrata cuando un media query de CSS matcheaclient:only— Saltea server rendering, renderiza solo en cliente
El factor Cloudflare
Astro v6 (actualmente en beta) introduce integración profunda con Cloudflare:
- El dev server corre en el runtime de Cloudflare — Tu entorno dev matchea producción exactamente. No más "funciona en dev, se rompe en prod" con APIs de Workers.
- Acceso first-class a primitivas de Cloudflare — Durable Objects, R2 Storage, D1 Database, AI Workers directamente desde componentes Astro.
- Deploy global en edge por defecto — Todo sitio Astro se deploya a la red edge de Cloudflare sin configuración.
Esto significa que Astro ya no es solo "el framework de sitios estáticos." Con Workers, D1 y Durable Objects, podés construir apps genuinamente dinámicas — pero con la filosofía zero-JS de Astro.
Framework agnóstico: el arma secreta
Lo más subestimado de Astro: podés usar cualquier framework UI adentro. React, Vue, Svelte, Solid, Preact, Lit — elegí, o mezclalos.
--- // Sí, literalmente podés mezclar React y Svelte en la misma página import ReactCounter from '../components/ReactCounter.tsx'; import SvelteChart from '../components/SvelteChart.svelte'; import VueForm from '../components/VueForm.vue'; --- <h1>Ensalada de Frameworks</h1> <ReactCounter client:load /> <SvelteChart client:visible /> <VueForm client:idle />
Suena gimmicky pero es genuinamente útil para:
- Proyectos de migración — Migrando de Vue a React? Usá ambos durante la transición.
- Componentes best-of-breed — Usá una librería de charts React junto con una librería de forms Svelte.
- Flexibilidad de equipo — Distintos equipos pueden usar distintos frameworks.
Cuándo elegir Astro
- Sitios content-first: Blogs, documentación, marketing, e-commerce. Astro será 2-10x más rápido que Next.js.
- Performance innegociable. Zero-JS por defecto = camino más fácil a Core Web Vitals perfectos.
- Querés el ecosistema Cloudflare. La adquisición lo hace el framework más integrado.
- Equipos multi-framework. Es el único meta-framework que soporta todos los frameworks UI nativamente.
Cuándo evitar Astro
- Productos SaaS full-stack. Si toda página necesita auth, real-time y estado complejo de cliente, el modelo de islas genera fricción.
- Navegación estilo SPA. Astro usa navegaciones de página completa por defecto (con View Transitions para UX suave).
- Necesitás un ecosistema React maduro. Astro soporta React, pero su ecosistema propio es más chico que el de Next.js.
SvelteKit: La corona de la experiencia de desarrollo
SvelteKit es el dark horse que sigue ganando encuestas de satisfacción. Construido sobre el sistema de runes de Svelte 5, ofrece una DX que hace que React se sienta verboso.
Por qué Svelte es diferente
Svelte toma un enfoque fundamentalmente distinto: compila el framework y lo hace desaparecer.
React:
Código → [Runtime React (44KB)] → Virtual DOM Diffing → Actualizaciones DOM
Svelte:
Código → [Compilador] → Actualizaciones DOM quirúrgicas (sin runtime, sin virtual DOM)
No hay virtual DOM. No hay algoritmo de diffing. El compilador de Svelte analiza tu código en build time y genera JavaScript vanilla que hace updates precisos al DOM. El resultado: bundles más chicos y runtime más rápido.
Svelte 5 Runes: El nuevo modelo de reactividad
Svelte 5 reemplazó la vieja sintaxis $: con "runes" — primitivas de reactividad explícitas, más predecibles y componibles:
<script> // Svelte 5 con runes let count = $state(0); let doubled = $derived(count * 2); function increment() { count++; // Mutá directamente — Svelte trackea el update } </script> <button onclick={increment}> {count} × 2 = {doubled} </button>
Compará con React:
function Counter() { const [count, setCount] = useState(0); const doubled = useMemo(() => count * 2, [count]); return ( <button onClick={() => setCount(c => c + 1)}> {count} × 2 = {doubled} </button> ); }
Svelte es más corto, sin reglas de hooks, sin bugs de stale closures, sin dependency arrays. El compilador maneja todo el tracking de reactividad automáticamente.
Arquitectura de SvelteKit
La arquitectura de SvelteKit se parece a Remix en muchas formas — rutas anidadas, carga de datos server-first, form actions:
Request del Browser
↓
Route Matching (anidamiento +layout.svelte)
↓
+page.server.ts load() → Devuelve datos
↓
+page.svelte renderiza con datos cargados
↓
Cliente hydrata + maneja navegaciones SPA
Ejemplo de código: Flujo full-stack
// src/routes/todos/+page.server.ts import type { PageServerLoad, Actions } from './$types'; export const load: PageServerLoad = async ({ locals }) => { const todos = await locals.db.todo.findMany({ where: { userId: locals.user.id }, orderBy: { createdAt: 'desc' }, }); return { todos }; }; export const actions: Actions = { create: async ({ request, locals }) => { const data = await request.formData(); await locals.db.todo.create({ data: { text: data.get('text') as string, userId: locals.user.id, }, }); }, delete: async ({ request, locals }) => { const data = await request.formData(); await locals.db.todo.delete({ where: { id: data.get('id') as string }, }); }, };
<!-- src/routes/todos/+page.svelte --> <script> import { enhance } from '$app/forms'; let { data } = $props(); </script> <h1>Mis Todos</h1> <form method="POST" action="?/create" use:enhance> <input name="text" placeholder="¿Qué hay que hacer?" required /> <button>Agregar</button> </form> <ul> {#each data.todos as todo} <li> {todo.text} <form method="POST" action="?/delete" use:enhance> <input type="hidden" name="id" value={todo.id} /> <button>×</button> </form> </li> {/each} </ul>
La directiva use:enhance habilita progressive enhancement — los forms funcionan sin JavaScript, pero cuando JS está disponible, SvelteKit intercepta los envíos para una experiencia tipo SPA con revalidación automática.
Performance: La ventaja del compilador
| Framework | Bundle Hello World | Bundle App Media | Gzipped |
|---|---|---|---|
| Next.js 15/16 | ~85KB | ~180-250KB | ~60-80KB |
| Remix | ~65KB | ~150-220KB | ~50-70KB |
| SvelteKit | ~15KB | ~60-120KB | ~20-40KB |
| Astro (sin islas) | ~0KB | ~0-50KB | ~0-15KB |
SvelteKit envía consistentemente 50-70% menos JavaScript que frameworks basados en React para funcionalidad equivalente. Esto se traduce directamente en TTI más rápido y mejores scores de INP.
Cuándo elegir SvelteKit
- La DX es tu prioridad máxima. Svelte domina las encuestas de satisfacción año tras año.
- Necesitás performance pero también un framework full-stack. SvelteKit da los bundles más chicos de cualquier app framework.
- Estás armando una startup. Equipo chico + productividad Svelte = lanzamiento más rápido.
- Querés la experiencia "moderna" sin la complejidad de React (reglas de hooks, dependency arrays, bordes RSC).
Cuándo evitar SvelteKit
- Contratación a escala. Hay significativamente más devs React que Svelte.
- Dependés fuertemente de paquetes del ecosistema React. Librerías de componentes, integraciones CMS, soluciones auth — React tiene 10x más opciones.
- La adopción enterprise importa. Mientras crece, el track record enterprise de SvelteKit es más corto que el de Next.js.
Matriz de comparación
Poniéndolos lado a lado en las métricas que realmente importan:
Performance (menor es mejor)
| Métrica | Next.js 15/16 | Remix | SvelteKit | Astro |
|---|---|---|---|---|
| JS Bundle promedio (contenido) | 85-120KB | 70-100KB | 20-50KB | 0-5KB |
| JS Bundle promedio (app) | 180-250KB | 150-220KB | 60-120KB | N/A* |
| Cold Start (serverless) | ~120-200ms | ~80-150ms | ~60-120ms | ~30-80ms |
| TTFB (estático) | ~20ms (CDN) | ~50-100ms | ~20ms (CDN) | ~10ms (CDN) |
| Lighthouse (contenido) | 85-95 | 90-98 | 92-99 | 98-100 |
Astro no está diseñado para páginas full-app, así que la comparación directa no es justa.
Experiencia de desarrollo
| Factor | Next.js 15/16 | Remix | SvelteKit | Astro |
|---|---|---|---|---|
| Curva de aprendizaje | Empinada (RSC, caching) | Moderada (web standards) | Suave (intuitiva) | Fácil (HTML+) |
| Soporte TypeScript | Excelente | Excelente | Excelente | Excelente |
| Velocidad HMR (Turbopack) | Rápida | Rápida | Muy rápida | Muy rápida |
| Complejidad mental | Alta (5 modos) | Baja (loader/action) | Baja (load/actions) | Muy baja (static+) |
| Satisfacción dev (encuestas) | Mixta | Alta | Más alta | Alta |
Ecosistema & Comunidad
| Factor | Next.js 15/16 | Remix | SvelteKit | Astro |
|---|---|---|---|---|
| Downloads npm/semana | ~7M | ~2M* | ~500K | ~800K |
| Librerías de componentes | Masivas | Grandes (React) | Creciendo | Vía integraciones |
| Mercado laboral | Dominante | Moderado | Creciendo | Nicho |
| Respaldo corporativo | Vercel | Shopify | Vercel** | Cloudflare |
| GitHub Stars | ~130K | React Router 54K | ~82K | ~50K |
Los downloads de Remix se cuentan dentro de los de React Router v7.
*Vercel emplea a Rich Harris (creador de Svelte) y a varios miembros del equipo Svelte.
Deployment & Hosting
| Factor | Next.js 15/16 | Remix | SvelteKit | Astro |
|---|---|---|---|---|
| Mejor target de deploy | Vercel | Cualquier host Node | Cualquiera (adapters) | Cloudflare |
| Edge Runtime | Sí (Vercel) | Sí (vía adapters) | Sí (vía adapters) | Nativo (CF Workers) |
| Facilidad self-hosting | Moderada | Fácil | Fácil | Fácil |
| Export estático | Sí | No | Sí | Sí (default) |
| Soporte Docker | Sí | Sí | Sí | Sí |
Guía de decisión práctica
Dejá de preguntar "¿cuál es mejor?" y empezá con "¿qué estoy construyendo?"
¿Sitio de contenido? → Astro
Blogs, documentación, marketing, portfolio, e-commerce con páginas mayormente estáticas. La diferencia de performance es abrumadora. Con Cloudflare detrás, Astro no va a ningún lado.
¿App web full-stack? → Next.js o SvelteKit
SaaS, dashboard admin, red social, marketplace con interacciones complejas.
- Next.js si la contratación a escala importa, necesitás el ecosistema React, o ya invertiste en React.
- SvelteKit si valorás la DX, tu equipo es chico/mediano, y la performance importa.
¿App CRUD centrada en formularios? → Remix
Herramientas internas, admin panels, workflows multi-paso. El patrón loader/action de Remix fue hecho para esto. Progressive enhancement hace que tus forms funcionen sin JavaScript — crítico para confiablidad.
¿No sabés? → Next.js
Si genuinamente no podés decidir y necesitás la apuesta más segura, Next.js tiene la comunidad más grande, más paquetes y más flexibilidad. No es el mejor en nada específico, pero es bueno en todo.
Lo que nadie dice
1. Espectro de vendor lock-in
- Más portables: Remix, SvelteKit — Sistema de adapters te deja deployear en cualquier lado con cambios mínimos.
- Algo de lock-in: Astro — Funciona en todos lados pero Cloudflare es claramente la experiencia first-class.
- Más lock-in: Next.js — Técnicamente se deploya en cualquier lado, pero ISR, Middleware, Image Optimization y PPR funcionan mejor (o solo) en Vercel. Self-hostear Next.js requiere conocimiento operacional significativo.
2. La brecha de experiencia TypeScript
Los cuatro soportan TypeScript, pero la calidad difiere:
- Next.js: Bueno pero ocasionalmente frustrante. Los bordes de Server/Client components pueden confundir al sistema de tipos.
generateStaticParams,generateMetadatay otras convenciones requieren aprender Nextisms. - Remix: Excelente.
useLoaderData<typeof loader>()da inferencia de tipos perfecta de servidor a cliente. - SvelteKit: Excelente. La auto-generación de
$typesse siente mágica — los tipos fluyen de+page.server.tsa+page.sveltesin fricción. - Astro: Excelente para contenido. Content Collections proveen validación de frontmatter type-safe.
3. Consideraciones por tamaño de equipo
- Solo / 1-3 devs: SvelteKit o Astro. Máxima productividad con mínima ceremonia.
- Equipo chico (4-10): SvelteKit o Remix. Iteración rápida, modelos mentales simples.
- Equipo mediano (10-30): Next.js o SvelteKit. Las convenciones de Next.js ayudan con consistencia a escala.
- Equipo grande (30+): Next.js. La ventaja del pool de talento es decisiva.
4. El riesgo de "rewrite"
Los frameworks evolucionan. ¿Qué tan disruptivos son los upgrades?
- Next.js tiene historial de cambios de API grandes (Pages → App Router fue doloroso). El ritmo de cambio del ecosistema React (RSC, Compiler, Server Actions) implica aprendizaje continuo.
- Remix tuvo la fusión con React Router v7, que fue confusa pero no técnicamente breaking.
- SvelteKit tuvo Svelte 4 → 5 (runes), el cambio más significativo. El tooling de migración fue bueno, pero fue un paradigm shift.
- Astro fue el más estable en API. La adquisición de Cloudflare agrega features sin romper APIs existentes.
Mirando hacia adelante
Los meta-frameworks están convergiendo de formas interesantes:
Next.js 16 está estabilizando PPR hacia convertirse en el modo de rendering por defecto. La migración a Turbopack está completa — Webpack es efectivamente legacy. El React Compiler va a madurar más, achicando la brecha de DX con SvelteKit.
Remix/React Router se divide en dos caminos: React Router v7 como framework estable y production-ready para apps React, y Remix 3 como playground experimental para desarrollo web de próxima generación. Con Shopify detrás, están posicionados como la opción "pragmática."
Astro bajo Cloudflare tiene la trayectoria más interesante. Se espera integración más profunda con Workers AI, Durable Objects y R2. Astro podría evolucionar de "mejor framework estático" a "mejor framework Cloudflare" — un mercado enorme.
SvelteKit se beneficiará de la madurez de Svelte 5 y la adopción enterprise creciente. El approach del compilador se valida cada vez más como la apuesta arquitectónica correcta para performance. La posición de Rich Harris en Vercel asegura que el framework tiene recursos.
La verdad honesta: los frameworks se parecen cada vez más en capacidades. Las diferencias que quedan son filosóficas (zero-JS default vs hydrate-everything, web standards vs abstracción) más que funcionales.
Conclusión
La respuesta real tiene tres partes:
1. Matcheá el framework con el tipo de contenido:
- Content-first → Astro
- App-first → Next.js, SvelteKit o Remix
2. Matcheá el framework con tu equipo:
- Equipo React grande → Next.js
- Equipo chico que quiere productividad → SvelteKit
- Equipo que valora web standards → Remix
- Equipo multi-framework → Astro
3. Matcheá el framework con tu deploy target:
- Cloudflare → Astro
- Vercel → Next.js o SvelteKit
- Anywhere/self-hosted → Remix o SvelteKit
Las guerras de meta-frameworks no son guerras. Son especializaciones. Cada uno es la mejor opción para una combinación específica de tipo de proyecto, composición de equipo y target de deploy. Encontrá tus restricciones, y la respuesta es obvia.
Dejá de pelear por frameworks. Empezá a lanzar productos.
Explora herramientas relacionadas
Prueba estas herramientas gratuitas de Pockit