WordPress como Repositorio de Datos: Usando WP Solo para Alimentar Astro

WordPress es insuperable cuando se trata de gestión de contenido. Editores, redactores y administradores de sitios están acostumbrados a su interfaz (wp-admin), sus herramientas de programación y su ecosistema de bloques. Sin embargo, usar WordPress para servir el sitio público directamente suele introducir cuellos de botella de rendimiento, costos de infraestructura y constantes vulnerabilidades de seguridad.

Una solución robusta para evitar estos problemas sin obligar al equipo editorial a migrar de plataforma es utilizar WordPress como un CMS Headless, extrayendo los datos de posts y páginas a través de una API para alimentar un frontend moderno y ultra rápido en Astro.

¿Por qué desacoplar WordPress?

En el modelo tradicional de WordPress, la renderización de las páginas ocurre de forma dinámica en el servidor con cada solicitud del visitante (o depende de complejos plugins de caché que crean archivos estáticos locales en el servidor PHP). Al desacoplar el sistema:

1. La seguridad aumenta drásticamente: Tu servidor WordPress se puede colocar detrás de una red privada o de reglas estrictas de Firewall, evitando que wp-admin y el motor PHP queden expuestos a la internet pública.
2. Rendimiento máximo: Astro consume los posts de la API de WordPress solo en el momento del build y genera archivos HTML/CSS estáticos puros. El sitio público final se entrega directamente desde una CDN (como Cloudflare Pages), lo que resulta en tiempos de carga instantáneos.
3. Hospedaje barato o gratuito: Como el sitio final es estático, puedes servirlo sin los costos de hospedaje tradicionales, mientras que tu panel de WordPress puede ejecutarse en una infraestructura más pequeña y local o en un VPS de bajo costo.

Configurando WordPress como CMS Headless

WordPress ya tiene una REST API nativa y robusta habilitada por defecto. Cualquier instalación expone el endpoint /wp-json/wp/v2/posts con todos los posts publicados.

Para preparar WordPress para este escenario, ayudan algunas buenas prácticas:

• Deshabilitar temas públicos: Instala un tema en blanco o utiliza plugins que redireccionen todos los accesos del frontend tradicional directamente a una página estática o al panel administrativo.
• Utilizar plugins de Custom Fields (como ACF): Si necesitas metadatos específicos para tus artículos (como enlaces de fuentes consultadas, tiempo de lectura personalizado o campos de SEO), el plugin Advanced Custom Fields expone estas variables en la API REST fácilmente.

Consumindo os dados no Astro

En Astro, consumimos los posts de manera síncrona durante el build. Podemos crear una función auxiliar en TypeScript para buscar estos datos y renderizarlos dinámicamente en las páginas.

Ejemplo de llamada directa:

// src/lib/wordpress.ts
export interface WPPost {
  id: number;
  title: { rendered: string };
  slug: string;
  content: { rendered: string };
  excerpt: { rendered: string };
  date: string;
}

export async function getWordPressPosts(): Promise<WPPost[]> {
  const res = await fetch('https://tu-wordpress-privado.com/wp-json/wp/v2/posts?per_page=100');
  if (!res.ok) throw new Error('Error al buscar posts de WordPress');
  return res.json();
}

Y en tu archivo de rutas dinámicas de Astro (por ejemplo, src/pages/blog/[slug].astro), mapeas los posts de WordPress a rutas estáticas:

---
import { getWordPressPosts } from '../../lib/wordpress';

export async function getStaticPaths() {
  const posts = await getWordPressPosts();
  return posts.map((post) => ({
    params: { slug: post.slug },
    props: { post },
  }));
}

const { post } = Astro.props;
---
<h1>{post.title.rendered}</h1>
<article set:html={post.content.rendered} />

Optimizaciones de rendimiento y seguridad en la API REST

Dado que Astro realizará solicitudes a la API de WordPress cada vez que se compile el sitio, debes optimizar este canal de comunicación:

• Campos Reducidos: Por defecto, la API de WordPress envía docenas de campos que probablemente no usarás (como datos de etiquetas anidadas, enlaces de metadatos internos, etc.). Utiliza el parámetro _fields en la cadena de consulta (por ejemplo, ?_fields=author,id,title,slug,content,date) para ahorrar ancho de banda y acelerar la respuesta del servidor.
• Caché de API: Si tu sitio tiene miles de artículos, las llamadas pueden sobrecargar la base de datos. Configura Cloudflare o un caché local (como Redis) frente a la API de WordPress para agilizar las compilaciones.

Conclusión

Unir el poder editorial de WordPress con la excelencia técnica de Astro es una de las mejores soluciones arquitectónicas para portales de contenido y blogs de tráfico medio a alto. No desechas la inversión en la usabilidad de WordPress, sino que obtienes un sitio extremadamente veloz, seguro y de bajo costo operativo.

Sigue leyendo

Operaciones de contenidoPor qué cambiar el WordPress tradicional por una arquitectura headless con Astro

Los motivos que me llevaron a salir de un WordPress monolítico hacia una arquitectura modular con Astro, n8n y Baserow.

RendimientoEl costo oculto de cargar Elementor: por qué cambié constructores visuales pesados por una arquitectura code-first

Entiende el impacto técnico del bloat visual en el DOM y el TTFB, y por qué una arquitectura JAMstack code-first tiende a ser más predecible para SEO y rendimiento.

Tecnologías y Conceptos

• WordPress REST API Handbook
• Astro Docs: Fetch data in Astro