Présentation de Astro : pourquoi j’ai choisi ce framework pour ce blog

Créer un blog technique, c’est aussi l’occasion de tester des outils modernes. Après avoir longtemps hésité entre Next.js, Nuxt et Hugo, j’ai choisi Astro pour ce blog. Pourquoi ? Parce qu’Astro propose un compromis unique entre performance, simplicité, et flexibilité.

Astro, c’est quoi ?

Astro est un framework JavaScript moderne orienté contenu statique. Il permet de construire des sites rapides en générant du HTML statique, tout en autorisant l’utilisation de composants interactifs issus de frameworks comme React, Vue, Svelte, Solid ou même Web Components.

“Ship less JavaScript” — c’est le mantra d’Astro. Le JavaScript est chargé uniquement là où c’est nécessaire.

Pourquoi Astro pour ce blog ?

Voici ce qui m’a convaincu :

Maintenance facile : pas besoin de serveur, tout est statique.
Performance native : les pages se chargent instantanément.
Composabilité : je peux utiliser React ou Svelte là où j’en ai besoin, sans imposer un seul écosystème.
Markdown natif : parfait pour écrire des articles techniques sans friction.

Ce blog est généré entièrement avec Astro, et déployé sur un hébergeur statique (comme Netlify ou Vercel), ce qui réduit la complexité à quasiment zéro.

Comparaison rapide avec d’autres frameworks

Framework	SSR/Static	JavaScript par défaut	Utilisation recommandée
Astro	Static/SSR	Zéro JS par défaut	Blogs, documentations, landing pages
Next.js	SSR/Static	React obligatoire	Apps dynamiques, dashboards
Nuxt	SSR/Static	Vue obligatoire	Apps Vue, e-commerce, etc
SvelteKit	SSR/Static	JS minimal	Apps interactives avec Svelte

Quand utiliser Astro ?

Blogs et documentation
Landing pages
Sites e-commerce simples
Portfolios ou sites vitrine

Astro est idéal quand :

Le contenu est principalement statique.
Vous cherchez des performances optimales.
Vous ne voulez pas d’un gros runtime JS côté client.

Quand éviter Astro ?

Vous construisez une application full interactive avec beaucoup d’état client (genre Trello ou Notion).
Vous avez besoin d’un rendu en temps réel serveur-client, comme du chat ou du streaming.

Dans ce cas, un framework comme Next.js (React) ou SvelteKit sera plus adapté.

Exemple de code : une page Astro

Voici un petit exemple de page Astro (index.astro) :

---
const name = "Bienvenue sur mon blog Astro !";
---

<html lang="fr">
  <head>
    <title>Mon Blog Astro</title>
  </head>
  <body>
    <h1>{name}</h1>
    <p>Ce blog est rapide, léger, et statique ⚡</p>
  </body>
</html>

Conclusion

Créer ce blog avec Astro m’a permis de me concentrer sur le contenu sans sacrifier la performance. Il ne s’adresse pas à tous les projets, mais il brille dans les cas où le contenu prime sur l’interaction.

C’est quoi Astro