O problema com frameworks JavaScript modernos
Next.js e afins são ótimos para aplicações interativas. Para sites de conteúdo — blogs, portfólios, landing pages — eles trazem JavaScript desnecessário que prejudica performance e SEO.
O resultado típico: Lighthouse score abaixo de 90, bundle de 200KB+ para uma página que poderia ser HTML puro.
Por que Astro resolve isso
Astro usa uma abordagem chamada islands architecture: o HTML é gerado no servidor, e JavaScript é enviado para o cliente apenas quando um componente específico precisa de interatividade.
---
const posts = await getCollection('posts');
---
<ul>
{posts.map(post => <li>{post.data.title}</li>)}
</ul>
<SearchBar client:load />Resultados reais
Em todos os sites que migramos para Astro:
- Lighthouse Performance: de ~75 para 98-100
- First Contentful Paint: redução média de 1.8s para 0.4s
- JavaScript enviado: redução de 85% em média
Integração com React
Astro não substitui React — funciona com ele. Você pode usar componentes React para as partes interativas e Astro para o resto:
import { ContactForm } from './ContactForm';
<ContactForm client:load />Quando não usar Astro
- Aplicações altamente interativas (dashboards, editores)
- Quando você precisa de SSR com estado de usuário complexo
- Times sem experiência com o modelo de islands
Conclusão
Para o ecossistema Arkana Studios, Astro é a escolha padrão para sites institucionais e blogs. O resultado é melhor performance, melhor SEO e uma base de código mais simples de manter.