Astro + Tailwind + Cloudflare: Por Que Abandonamos WordPress

O Problema Com WordPress (Para Nós)

WordPress domina 43% da web. É excelente para blogs, e-commerce e sites que precisam de edição frequente por não-desenvolvedores. Nós usamos WordPress por 6 anos, operamos mais de 30 sites nele e entendemos bem seus pontos fortes.

Mas para sites institucionais de alta performance — landing pages, portfólios e sites corporativos — WordPress se tornou, na nossa experiência, um obstáculo:

• Performance baseline ruim: WordPress sem otimização marca 40-60/100 no PageSpeed. Com cache, CDN, otimização de imagens e 8 plugins, chega a 75-85. Muito trabalho para resultado mediano.

• Superfície de ataque enorme: cada plugin é um vetor. Em 2025, 97% das vulnerabilidades WordPress vieram de plugins de terceiros. Atualizações semanais de segurança são obrigatórias.

• Custo de manutenção oculto: hosting, SSL, backup, atualizações, compatibilidade entre plugins, PHP, banco de dados. Para um site institucional que muda 2x por ano, é over-engineering.

• Vendor lock-in visual: themes como Divi e Elementor criam dependência. Migrar de theme significa reconstruir do zero.

“A melhor arquitetura é a mais simples que resolve o problema. Para sites estáticos, WordPress é complexidade desnecessária.”

A Filosofia SFA: Static-First Architecture

SFA (Static-First Architecture) é o princípio que adotamos: começar com HTML estático puro e adicionar complexidade apenas quando necessário. A premissa:

• Se pode ser HTML estático, é HTML estático.

• Se precisa de interatividade local (menus, modais, carousels), Alpine.js — 15KB.

• Se precisa de componentes React, usa Astro Islands — hidratação parcial.

• Se precisa de dados dinâmicos, usa API/n8n — nunca banco de dados no servidor do site.

O resultado é um site que é servido como arquivos estáticos na edge da Cloudflare — 300+ POPs globais, zero cold start, zero processamento no servidor.

A Stack: O Que Usamos e Por Quê

Astro 5 — O Framework

Astro foi desenhado para content-driven websites. Ao contrário de Next.js ou Nuxt que enviam JavaScript por padrão, Astro envia zero JS por padrão — só HTML e CSS. JavaScript é opt-in, via “Islands”.

• Zero JS by default: cada página é HTML puro. Componentes React/Vue são “ilhas” que hidratam independentemente.

• Component Islands: um carrossel React hidrata sozinho sem afetar o restante da página. Se o usuário nunca scrollar até ele, o JS nem é carregado.

• Content Collections: blog posts em Markdown com tipagem TypeScript. Schema validado em build time.

• View Transitions: navegação tipo SPA com <meta name="view-transition"> — sem framework de routing.

Tailwind CSS v4 — O Styling

Tailwind v4 trouxe melhorias significativas para a abordagem CDN:

• Play CDN via ESM: esm.sh/@tailwindcss/browser@4 processa Tailwind no browser. Para sites estáticos com <20 páginas, a performance é excelente — sem build step.

• @theme nativo: design tokens declarados em CSS puro, sem tailwind.config.js.

• Container queries: layout responsivo baseado no container, não no viewport — ideal para componentes reutilizáveis.

Para projetos com build (Astro), usamos Tailwind compilado. Para protótipos e sites simples como este, Play CDN elimina toda a toolchain.

Cloudflare Pages — O Deploy

Cloudflare Pages é a CDN que serve o site globalmente com latência de 5-20ms. Vantagens:

• Deploy via git push: commit no GitHub → build automático → deploy em ~30 segundos.

• SSL automático: HTTPS sem configuração.

• Custo zero: o plano free suporta sites ilimitados com 500 builds/mês.

• Edge Functions: se precisar de lógica server-side (formulários, redirects), Workers roda na edge — sem servidor centralizado.

• Headers customizados: _headers file para CSP, HSTS, cache control — segurança enterprise sem nginx.

Benchmarks Reais: WordPress vs. SFA

Comparação do site anterior (WordPress + Divi + WP Rocket) com o site atual (HTML estático + Tailwind CDN + Cloudflare Pages), mesma máquina de teste, mesma conexão:

• PageSpeed (mobile): WordPress 72/100 → SFA 98/100

• LCP (Largest Contentful Paint): WordPress 2.8s → SFA 0.3s

• CLS (Cumulative Layout Shift): WordPress 0.12 → SFA 0.001

• FID (First Input Delay): WordPress 180ms → SFA 12ms

• TTFB (Time to First Byte): WordPress 890ms → SFA 18ms (edge)

• Tamanho da página (home): WordPress 3.2 MB → SFA 380 KB

• Requests HTTP: WordPress 47 → SFA 12

Custo Mensal

• WordPress: Hosting R$89/mês + domínio R$45/ano + plugins premium R$120/ano + manutenção ~2h/mês = ~R$130/mês total.

• SFA: Cloudflare Pages R$0 + domínio R$45/ano + manutenção ~15min/mês = ~R$4/mês total.

A Stack Completa de Interatividade

“Mas e se eu precisar de algo dinâmico?” — a resposta: Alpine.js + GSAP + Chart.js, tudo via CDN.

• Alpine.js (15KB): menus, modais, tabs, toggles, formulários reactivos — tudo declarativo no HTML, sem build.

• GSAP + ScrollTrigger (43KB): animações de scroll, counters, entradas progressivas — performance 60fps.

• Chart.js (65KB): gráficos interativos para ROI, métricas, comparações — carrega lazy, só quando visível.

• Lucide Icons (tree-shakeable): 1.500+ ícones SVG, carregados sob demanda.

Total de JavaScript interativo: ~140KB (gzipped: ~48KB). WordPress + jQuery + Divi + plugins: ~800KB-1.2MB.

Quando WordPress Ainda Faz Sentido

Transparência total: WordPress continua sendo a melhor escolha em cenários específicos:

• E-commerce robusto: WooCommerce com centenas de produtos, checkout complexo, integração ERP — Astro não substitui isso.

• Edição frequente por não-desenvolvedores: se o cliente precisa editar conteúdo diariamente sem saber código, WordPress + Gutenberg é imbatível.

• Blogs com volume alto: 100+ posts por mês com múltiplos autores — WordPress é feito para isso.

• Plugins de nicho: booking systems, LMS (LearnDash), membership — o ecossistema WordPress não tem paralelo.

Nossa decisão não é anti-WordPress. É pro-simplicidade: para cada projeto, usamos a ferramenta certa. Sites institucionais e landing pages não precisam de banco de dados.

Como Reproduzir Essa Stack

• Registre o domínio no registrador de preferência (Cloudflare Registrar oferece preço de custo).

• Crie o projeto Astro com npm create astro@latest — template “Empty” ou “Blog”.

• **Instale Tailwind ** com npx astro add tailwind — configuração automática.

• Conecte ao GitHub e linke o repositório no Cloudflare Pages.

• Configure DNS no Cloudflare — aponte o domínio para o projeto Pages.

• Deploy — cada git push gera build automático. Pronto.

Do zero ao site no ar: 30 minutos. Do zero ao site WordPress no ar: 2-4 horas (provisionamento, instalação, theme, plugins, SSL).

Conclusão

A web está convergindo para duas direções: aplicações complexas (Next.js, SvelteKit, Remix) e sites de conteúdo ultra-rápidos (Astro, 11ty, Hugo). WordPress ocupa o meio-termo — poderoso demais para sites simples, frágil demais para aplicações complexas.

Para sites institucionais, landing pages e portfólios, a stack Astro + Tailwind + Cloudflare entrega performance superior, custo zero, segurança passiva e manutenção mínima. Não é hype — é engenharia adequada ao problema.