Por qué elegimos Astro para webs corporativas (y cuándo no lo haríamos)

Cuando un cliente llega con una web corporativa — la homepage de la empresa, el sitio de producto, la web institucional — nuestra primera conversación ya no es sobre React vs Vue. Es sobre si necesitan JavaScript en absoluto.

Ahí es donde entra Astro.

El problema que Astro resuelve

Durante años, construir una web corporativa con React significaba enviar al usuario un bundle de 300-500KB de JavaScript para renderizar… texto estático. El contenido era el mismo para todos los visitantes, pero el usuario pagaba el coste de ejecutar un framework completo en su dispositivo.

Astro invierte la pregunta: ¿por qué enviar JavaScript si no lo necesitas?

---
// Este componente NO genera JavaScript en producción
// Solo HTML+CSS — carga instantánea
const features = [
  { title: "Rápido", desc: "Cero JS por defecto" },
  { title: "Simple", desc: "HTML + CSS puro" },
  { title: "Flexible", desc: "Integra React si lo necesitas" },
];
---

<section class="features">
  {features.map(f => (
    <div class="card">
      <h3>{f.title}</h3>
      <p>{f.desc}</p>
    </div>
  ))}
</section>

Este componente genera HTML puro. Sin runtime. Sin hidratación. Carga en milisegundos.

Los números reales

En uno de nuestros proyectos recientes — una web corporativa para una empresa del sector logístico — migramos de un WordPress con Elementor a Astro:

Métrica	WordPress + Elementor	Astro
LCP (Largest Contentful Paint)	4.2s	0.8s
TBT (Total Blocking Time)	1,840ms	0ms
JS enviado al cliente	487KB	12KB
PageSpeed (móvil)	34	98

Un PageSpeed de 98 en móvil no es un accidente — es el resultado de no enviar JavaScript que no se necesita.

Islands Architecture: lo mejor de dos mundos

Lo que hace único a Astro es el concepto de islas: partes interactivas de la página que sí hidrata, rodeadas de HTML estático.

---
import StaticHeader from './StaticHeader.astro';  // HTML puro
import ContactForm from './ContactForm.tsx';       // React, hidratado
import StaticFooter from './StaticFooter.astro';  // HTML puro
---

<StaticHeader />

<!-- Solo este componente carga React y se hidrata -->
<ContactForm client:load />

<StaticFooter />

El formulario de contacto necesita JavaScript para validación y envío. El resto de la página no. Astro solo hidrata lo que tiene sentido.

Cuándo Astro es la elección perfecta

• Web corporativa o de producto con contenido principalmente estático
• Blog o sitio de contenido con miles de páginas (el build genera HTML estático para todo)
• Landing pages donde el rendimiento impacta directamente en conversión
• Documentación técnica
• Cualquier proyecto donde el SEO sea crítico

Cuándo NO usaríamos Astro

Seamos honestos: Astro no es para todo.

No lo usaríamos para:

• Aplicaciones SaaS con dashboards complejos, estado global y muchas interacciones — ahí Angular o React son más adecuados
• E-commerce con personalización en tiempo real (carrito, recomendaciones dinámicas) — aunque Astro puede hacer e-commerce básico
• Aplicaciones con autenticación compleja y rutas protegidas — posible pero la experiencia de desarrollo es mejor en SPA frameworks

La frontera es simple: si el sitio tiene más pantallas que el usuario ve que pantallas que el usuario usa, Astro encaja. Si es al revés, probablemente necesites una SPA.

Astro + WordPress: el mejor de los dos mundos para CMS

Un patrón que usamos frecuentemente: WordPress como headless CMS + Astro como frontend.

---
// Datos desde la API REST de WordPress
const response = await fetch('https://cms.cliente.com/wp-json/wp/v2/posts');
const posts = await response.json();
---

<main>
  {posts.map(post => (
    <article>
      <h2 set:html={post.title.rendered} />
      <div set:html={post.excerpt.rendered} />
    </article>
  ))}
</main>

El cliente gestiona el contenido en WordPress (una interfaz que ya conoce). Astro genera el HTML en build time. El resultado: SEO perfecto, velocidad máxima, y el cliente puede editar posts sin tocar código.

Astro Content Collections para el blog

Para blogs gestionados directamente en código (como este), Astro tiene las Content Collections:

src/
  content/
    blog/
      mi-primer-post.md
      otro-articulo.md
  pages/
    blog/
      index.astro      ← listado
      [slug].astro     ← post individual

Los posts son ficheros Markdown con frontmatter validado por TypeScript. Sin base de datos, sin servidor, sin costes de hosting variables. El build genera HTML estático para cada post.

Conclusión

Para webs corporativas en 2025, Astro es nuestra primera opción por defecto. La combinación de rendimiento nativo, excelente DX, flexibilidad para añadir interactividad donde se necesita, y un ecosistema maduro lo convierte en la herramienta adecuada para la mayoría de proyectos de presencia web.

Si tu web actual tiene un PageSpeed por debajo de 70, tiene mucho margen de mejora — y probablemente una migración a Astro sea la forma más eficiente de conseguirla.

---

¿Tienes una web lenta que necesita una renovación? Escríbenos — hacemos auditorías de rendimiento gratuitas para proyectos nuevos.