Por qué elegí Astro para mi portfolio en lugar de Next.js

Cuando empecé a planificar este portfolio, mi instinto fue ir con Next.js. Lo uso en proyectos cliente hace años, lo conozco bien, y tiene todo lo que necesito. Pero tomé la decisión deliberada de probarlo con Astro, y no me arrepiento.

El problema con Next.js para un sitio estático

Next.js es excelente para aplicaciones dinámicas: dashboards, e-commerce, SaaS. Pero para un portfolio mayormente estático, carga demasiado JavaScript por defecto.

Con Next.js, el cliente descarga el runtime de React, el router de Next.js, y toda la lógica de hidratación aunque la página sea completamente estática. Para una landing page o un blog, eso es overhead puro.

Medí con Lighthouse en una implementación Next.js equivalente: 180KB de JavaScript comprimido solo para mostrar texto e imágenes.

Astro y la arquitectura de islas

El modelo de Astro es diferente desde los fundamentos. Por defecto, cero JavaScript en el cliente. Los componentes Astro se renderizan a HTML estático en build time.

Cuando necesitás interactividad — un filtro de portfolio, un acordeón, un formulario — usás client:visible o client:load para hidratar solo ese componente. El resto de la página sigue siendo HTML puro.

Para este portfolio, los únicos islands con JavaScript real son:

• PortfolioGrid (filtros interactivos)
• FAQAccordion (acordeón Radix UI)
• ContactForm (formulario con estados)
• ThemeToggle (dark/light mode)

El resto: HTML estático. Sin hidratación. Sin framework overhead.

La integración de React sigue funcionando

Lo mejor es que Astro no te obliga a abandonar React. Podés usar componentes React donde los necesitás con client:* directives. Así que toda mi biblioteca de componentes UI existente (Button, Badge, Card, Input) la reutilicé sin cambios.

La curva de aprendizaje fue mínima porque el modelo mental es simple: .astro para contenido estático, .tsx para islas interactivas.

Los números reales

Build del portfolio con Astro: 14 chunks JS, en total menos de 80KB comprimido para todas las islas juntas. Lighthouse Performance en mobile: 95+. Time to Interactive: bajo 2 segundos en conexión 4G simulada.

Cuándo no usaría Astro

Para aplicaciones con mucha interactividad del lado cliente —dashboards en tiempo real, SaaS con routing complejo, apps que necesitan estado global persistente— Next.js sigue siendo la opción correcta.

Astro brilla en sitios donde el contenido es el protagonista y la interactividad es complementaria. Portfolios, blogs, documentación, sitios corporativos: casos de uso perfectos.

La elección de framework siempre depende del problema. Esta vez, Astro era la herramienta correcta.