De WordPress para Astro: Um Estudo de Caso de Performance Extrema (2025)

Durante mais de uma década, fui um defensor fiel do WordPress. Ele paga minhas contas e alimenta 40% da web. Mas quando se trata do meu site pessoal, eu precisava de algo mais. Eu queria performance bruta.

Neste estudo de caso, vou detalhar exatamente como migrei este site (que você está lendo agora) de um stack LAMP tradicional para uma arquitetura JAMstack moderna com Astro, e os resultados chocantes que obtive.

O Problema com o WordPress

Não me entenda mal, o WordPress é incrível para clientes que precisam editar conteúdo dinâmica e constantemente. Mas para um site pessoal/blog de desenvolvedor, ele traz uma bagagem desnecessária:

1. Segurança: Você precisa estar sempre atualizando plugins para evitar brechas.
2. Performance: Cada visita aciona PHP no servidor, consultas ao MySQL, e renderização dinâmica. Cache ajuda, mas não resolve a raiz.
3. Hospedagem: É difícil hospedar WP de alta performance de graça.

Por que Astro?

Astro (astro.build) mudou o jogo com sua arquitetura de Islands Architecture.

Ao contrário de Next.js ou React puro, que enviam um bundle JS gigante para o navegador fazer a hidratação, o Astro remove todo o JavaScript por padrão. Ele entrega HTML puro. Se você precisa de interatividade (como um menu mobile), ele carrega apenas aquele pequeno pedaço de JS.

O Processo de Migração

1. Exportando o Conteúdo

O primeiro passo foi tirar o conteúdo do banco de dados MySQL aprisionado. Usei um script simples em Node.js para converter o XML de exportação do WordPress para arquivos Markdown com Frontmatter.

// Exemplo simplificado do script de migração
const xml = fs.readFileSync("export.xml", "utf8");
const posts = parseWPPosts(xml);

posts.forEach((post) => {
  const frontmatter = `---
title: "${post.title}"
date: "${post.date}"
tags: [${post.categories}]
---`;

  fs.writeFileSync(`./content/${post.slug}.md`, frontmatter + post.content);
});

2. Componentes vs Shortcodes

No WordPress, eu usava muitos shortcodes para botões e alertas. No Astro, transformei tudo isso em componentes reutilizáveis .astro ou React.

Antes (Shortcode WP): [button link="..."]Clique Aqui[/button]

Depois (Componente Astro):

---
// Button.astro
const { href } = Astro.props;
---
<a href={href} class="bg-blue-600 px-4 py-2 rounded text-white">
  <slot />
</a>

3. Imagens

O maior desafio. O WordPress gerenciava diferentes tamanhos de imagens automaticamente. No Astro, usei a tag <Image /> nativa que otimiza automaticamente para WebP e AVIF em tempo de build.

import { Image } from 'astro:assets';
import myImage from '../assets/my-image.jpg';

<Image src={myImage} alt="Descrição Otimizada" />

Os Resultados (Com Dados Reais)

A diferença não foi apenas “sentida”, foi mensurável.

Conclusão

Migrar para Astro não foi apenas uma escolha técnica, foi uma escolha de Experiência do Usuário (UX).

Se você é um desenvolvedor e seu site pessoal ainda roda em um CMS monolítico apenas para servir texto estático, você está deixando performance (e dinheiro) na mesa.