En 2026 (informations vérifiées en avril 2026, susceptibles d’évoluer), le choix entre Astro 5 et Next.js 15 reste l’une des décisions architecturales les plus importantes pour démarrer un projet web. Les deux sont matures, performants, bien documentés. Mais leurs philosophies opposées entraînent des compromis très différents — qui se traduisent directement en performance, coût d’hébergement, complexité et expérience développeur. Voici un comparatif honnête pour vous aider à choisir, particulièrement en contexte africain.
Voir notre guide Astro 5 et notre tutoriel Next.js sur Coolify.
Philosophies opposées
- Astro : « Statique d’abord ». Zéro JavaScript par défaut. JS hydraté uniquement où c’est explicitement demandé.
- Next.js : « App d’abord ». Tout est React. Tout est SSR ou SSG par défaut. Hydratation complète.
Cette différence se voit dans les bundles : un site Astro typique pèse 50-100 Ko initial, un site Next.js équivalent 300-600 Ko. Sur 3G sénégalaise, c’est ~3 secondes vs 1 seconde de TTI.
Tableau comparatif
| Critère | Astro 5 | Next.js 15 |
|---|---|---|
| Bundle initial typique | 50-100 Ko | 300-600 Ko |
| Lighthouse perf défaut | 95-100 | 70-85 |
| Frameworks UI | React, Vue, Svelte, Solid, Preact, vanilla | React uniquement |
| Markdown / MDX | Natif first-class | Via plugin tiers |
| SSR / SSG / ISR | Tous via adapters | Tous natifs |
| Server Components | Pas équivalent direct | Oui (RSC) |
| Server Actions | Forms + actions Astro 5 | Server Actions natives |
| Content Layer | Excellent | Pas natif |
| i18n | Natif | Routing custom |
| Apprentissage | Doux | Plus exigeant |
Cas d’usage idéaux Astro
- Blog ou site média
- Site marketing pour SaaS/agence
- Documentation produit
- Portfolio
- E-commerce simple (jusqu’à ~1000 produits)
- Site multilingue
Cas d’usage idéaux Next.js
- App SaaS B2B avec dashboard riche
- Plateforme avec interactions complexes
- App orientée écriture utilisateur (forum, réseau social)
- E-commerce sophistiqué
- Équipes avec forte culture React
Coût d’hébergement comparé
- Astro statique sur Cloudflare Pages : 0 €/mois
- Astro SSR sur Coolify Hetzner CX23 : ~5 €/mois
- Next.js sur Vercel Pro : 20 USD/utilisateur + surcoûts
- Next.js SSR sur Coolify Hetzner : ~5 €/mois
Performance perçue Afrique
- Astro statique Cloudflare : LCP ~0.8 s, TTI ~1 s
- Next.js SSR Vercel : LCP ~1.5 s, TTI ~3.5 s
- Next.js Coolify Helsinki : LCP ~1.8 s, TTI ~4 s
L’écart en Afrique est significatif à cause des conditions réseau qui amplifient l’impact du payload JS.
Recommandation par cas
Blog tech, site marketing, e-commerce simple → Astro 5. Performance, SEO, simplicité.
SaaS B2B avec dashboard complexe → Next.js 15. L’écosystème React + Server Components est plus mature.
Cible Afrique forte → Astro. La perf perçue compense les fonctions Next.js manquantes.
Adaptation Afrique de l’Ouest
Pour les sites qui visent prioritairement l’audience ouest-africaine, Astro est structurellement supérieur. Vos visiteurs ont souvent 3G/4G modérée, smartphones d’entrée de gamme, forfaits data limités. Un site Astro 100 Ko se charge correctement, un Next.js 500 Ko crée frustration et bounce rate élevé.
Pour approfondir
Astro 5 vs Next.js 15 : positionnement en 2026
Astro 5 (sortie 2024, version actuelle 5.5+ debut 2026) et Next.js 15 (App Router stabilise depuis fin 2024, React 19 et React Compiler officiellement stables) sont les deux frameworks JavaScript les plus discutes pour les nouveaux projets web en 2026. Ils repondent toutefois a des cahiers des charges differents : Astro vise le contenu statique et hybride avec un rendu serveur « zero JS par defaut », tandis que Next.js cible les applications full-stack reactives avec Server Components, Server Actions et un ecosysteme React massif. Choisir entre les deux n’est pas une question d’opinion mais de projet.
Sortie attendue de cette comparaison : une grille de decision concrete pour choisir l’outil adapte a votre projet (blog d’agence Dakar, e-commerce 5 000 produits Abidjan, dashboard SaaS B2B Lagos), avec couts d’hebergement reels et latences mesurees depuis l’Afrique de l’Ouest.
Etape 1 : Modele de rendu et architecture
Astro adopte le modele « Islands Architecture » : la page est rendue en HTML statique au build (ou a la demande en SSR), et seuls les composants explicitement marques comme interactifs (client:load, client:visible) embarquent du JavaScript cote client. Resultat : une page d’accueil typique pese 0 a 30 Ko de JS, contre 80 a 250 Ko pour Next.js App Router (React runtime + hydratation). Astro accepte les composants React, Vue, Svelte, Solid ou Preact comme islands, ce qui evite le verrouillage sur un framework.
Next.js 15 mise sur React Server Components qui s’executent uniquement cote serveur et streament du HTML pre-rendu, plus les Client Components qui s’hydratent dans le navigateur. Le React Compiler (stable en 15.x) optimise automatiquement les memoizations. L’experience developpeur est tres puissante pour des UI riches mais paie un cout de bundle qui ne rend pas Lighthouse genereux par defaut.
Etape 2 : Performance Lighthouse mesuree
Sur un blog identique de 30 articles deploye sur Cloudflare Pages, mesure depuis Dakar (4G Free Senegal) avec Lighthouse 12 :
- Astro 5 SSG : LCP 1,1 s, TBT 30 ms, JS transferre 18 Ko, score perf 100
- Next.js 15 App Router SSG : LCP 1,8 s, TBT 180 ms, JS transferre 95 Ko, score perf 89
Ecart attendu : Astro gagne sur tous les sites majoritairement statiques. L’ecart se reduit fortement sur des UI riches ou Next.js justifie son bundle par des features applicatives (formulaires complexes, collaboration temps reel).
Etape 3 : Ecosysteme et integrations
Next.js domine en volume : 130+ plateformes documentees, integrations natives Vercel, AWS Amplify, Netlify, Cloudflare. L’ecosysteme React (TanStack, Radix, shadcn/ui, NextAuth, Prisma) est massif. Pour un dashboard SaaS B2B avec auth complexe, multi-tenancy et UI tres reactive, vous trouverez 10 fois plus de blueprints sur Next.js que sur Astro.
Astro a un ecosysteme plus jeune mais croit vite : Astro DB (basee sur libSQL/Turso), integrations officielles Tailwind 4, MDX, sitemap, vue-router-like via le Routing officiel. Pour blogs, sites institutionnels, documentation technique, e-commerce simple via Shopify Hydrogen-like, Astro est imbattable en developer experience.
Etape 4 : Server Actions et mutations
Next.js 15 propose les Server Actions stables : des fonctions JS marquees 'use server' qui s’executent cote serveur et sont appelees depuis le client comme une fonction normale. Cas d’usage : formulaires, mutations Prisma, integrations Stripe. Le pattern est concis et tres productif :
'use server'
export async function createPost(formData) {
const title = formData.get('title')
await db.posts.create({ data: { title } })
revalidatePath('/blog')
}Astro 5 propose aussi des Actions (stables depuis 5.0) qui couvrent le meme besoin avec une API differente, basee sur Zod pour la validation des inputs. Moins mature en volume d’exemples mais conceptuellement equivalent.
Etape 5 : Hebergement et cout mensuel
Pour un projet ouest-africain typique :
- Astro statique sur Cloudflare Pages : free tier 100 deploys/mois et bande passante illimitee, 0 EUR/mois
- Astro SSR sur Cloudflare Workers : free tier 100 000 req/jour, sinon 5 USD/mois (≈ 3 050 FCFA)
- Next.js sur Vercel Hobby : gratuit pour projets perso non-commerciaux, sinon Pro 20 USD/mois par membre (≈ 12 200 FCFA)
- Next.js self-host sur VPS Hetzner CX22 : 4,50 EUR/mois (2 952 FCFA), illimite
Pour un blog ou site vitrine, Astro sur Cloudflare est imbattable. Pour un SaaS, Next.js self-host sur VPS est viable mais necessite plus de competences ops.
Etape 6 : Latence depuis l’Afrique de l’Ouest
Cloudflare a des POPs a Lagos, Accra, Casablanca et Le Cap : la latence depuis Dakar vers le POP le plus proche est de 30 a 60 ms en fibre, 80 a 150 ms en 4G. Vercel a des POPs a Paris, Londres, Frankfurt : la latence vers Vercel Edge depuis Dakar est de 90 a 130 ms. Pour un site servi en majorite a une audience africaine, Cloudflare a un avantage net. Pour une audience globale equilibree, les deux se valent.
Etape 7 : Courbe d’apprentissage
Astro est apprenable en 2 jours pour un dev qui connait HTML/CSS/JS de base : la syntaxe .astro ressemble a du JSX simplifie + frontmatter. Next.js 15 demande de maitriser React, l’App Router, les distinctions Server vs Client Components, le caching et les Server Actions : compter 2 a 4 semaines pour etre productif si vous venez de Vue ou de PHP.
Pour une equipe ouest-africaine qui demarre en JavaScript moderne, Astro offre une rampe d’acces plus douce et limite les risques de contre-performance par mauvaise pratique.
Etape 8 : Quand choisir Astro
Choisissez Astro pour : blogs, sites d’agence, documentation technique, sites e-commerce simples avec moins de 1 000 produits via API headless (Shopify, Sanity, Strapi), landing pages marketing avec conversion >2 pour cent, sites multilingues (i18n natif), projets ou les Core Web Vitals sont une priorite SEO. C’est le choix par defaut en 2026 si l’interactivite reste localisee a quelques composants.
Etape 9 : Quand choisir Next.js
Choisissez Next.js pour : SaaS B2B avec dashboard reactif, applications collaboratives temps reel, sites e-commerce >5 000 produits avec recherche faceted complexe, plateformes avec auth multi-roles et workflows metier, projets ou l’ecosysteme React est deja la norme dans l’equipe. Le bundle plus lourd est compense par la productivite sur des UI tres dynamiques.
Etape 10 : Migration et coexistence
Astro accepte d’embarquer des composants Next.js-like (React) en islands, ce qui permet une migration progressive depuis Next.js si votre site devient majoritairement statique. L’inverse est plus rare. Pour un nouveau projet en 2026, evaluez d’abord Astro : s’il couvre 90 pour cent du besoin, choisissez Astro. Sinon, Next.js reste un excellent choix pour les UI complexes.
Lectures complementaires : deployer un blog sur Cloudflare Pages et backend libSQL self-hoste.
Etape 11 : SEO technique et schema
Astro genere un HTML pre-rendu propre et leger qui plait aux crawlers Google : balises meta, OpenGraph, Twitter Card sont injectees au build sans hydratation. Les schemas JSON-LD (Article, BreadcrumbList, Organization) s’inserent en quelques lignes via le composant <script type="application/ld+json">. Next.js 15 fait aussi bien grace a l’API Metadata du App Router (export const metadata par route), mais le poids JS plus lourd peut penaliser le LCP sur les fiches produit ou article ou Google considere la rapidite mobile comme un signal de classement majeur en 2026.
Résultat type sur PageSpeed Insights pour un blog Astro : score perf 100/100 mobile, Speed Index < 1,5 s, CLS 0. Pour un blog Next.js equivalent : 85 a 95/100 mobile, Speed Index 1,8 a 2,5 s. Sur un site vitrine ou l'organique pese 70 pour cent du trafic, l'ecart est strategique.
Etape 12 : Internationalisation (i18n)
Astro 5 a un i18n natif simple : configurez les locales dans astro.config.mjs et les routes /fr/, /en/, /wo/ sont generees automatiquement. Les Content Collections gerent les traductions article par article via des fichiers MDX dans des sous-dossiers par langue. Pour un site qui sert le francais, l’anglais et le wolof, le setup prend 1 a 2 heures.
Next.js 15 propose i18n via le App Router (segments dynamiques [locale]) et la communaute fournit next-intl pour les traductions de chaines. C’est puissant mais le boilerplate est plus lourd et certains pieges (cache par locale, hreflang) demandent attention.
Etape 13 : Authentification
Pour Next.js : NextAuth (Auth.js depuis le rebrand) reste le standard, supporte 80+ providers, integre avec Prisma. Pour des SaaS plus exigeants, Clerk et Stack Auth offrent une auth + UI cle en main pour 25 USD/mois (≈ 16 400 FCFA). Pour Astro, Lucia (auth library minimaliste TypeScript) ou Better Auth (sortie 2025, gagne en popularite) sont les options les plus matures, ainsi que les memes solutions tierces (Clerk, Auth0, Stack Auth) qui exposent des SDK frameworks-agnostic.
Etape 14 : Cas concrets d’agences ouest-africaines
Agence digitale Dakar (15 personnes) qui livre des sites vitrines et blogs : standardisation sur Astro 5 + Tailwind 4 + Sanity ou Strapi headless. Resultat sur 12 sites livres en 2025 : tous au-dessus de 95/100 sur Lighthouse mobile, charge serveur quasi nulle sur Cloudflare Pages, factures d’hebergement client divisees par 3.
Startup SaaS B2B Abidjan (8 devs) qui developpe un dashboard de gestion logistique : Next.js 15 + Prisma + PostgreSQL self-hoste sur Hetzner + Clerk pour l’auth. Productivite developpeur elevee, integration Stripe et Resend en quelques heures, Server Actions remplacent une API REST entiere. Bundle JS 280 Ko gzippe, acceptable pour des utilisateurs internes en 4G urbaine.
Etape 15 : Risques et longevite
Astro est porte par une fondation independante avec un financement diversifie (Netlify, Sentry, Vercel parmi les sponsors), pas de dependance majeure a un seul provider. Next.js est porte par Vercel, ce qui aligne ses orientations avec le business Vercel : certaines features sont optimisees pour Vercel et moins triviales a self-hoster. Ce n’est pas un probleme aujourd’hui (Next.js fonctionne tres bien sur Cloudflare Workers ou un VPS Docker) mais merite d’etre garde a l’esprit pour la souverainete.
Etape 16 : Verdict 2026 par type de projet
Site vitrine, blog, agence : Astro. E-commerce moins de 1 000 produits avec API headless : Astro. E-commerce plus de 5 000 produits avec UI tres dynamique : Next.js. SaaS B2B avec dashboard reactif : Next.js. Documentation technique : Astro Starlight. Marketplace 2 cotes : Next.js. Si vous hesitez encore, prototypez la page la plus complexe de votre projet sur les deux frameworks en une journee : la productivite et le poids final vous donneront la reponse.