Trois générateurs statiques reviennent systématiquement dans les cahiers des charges qui atterrissent à l’agence cette année : Gatsby, toujours solidement installé, Next.js utilisé en mode d’export statique, et Eleventy, plus discret mais de plus en plus demandé pour sa simplicité. Ce comparatif s’appuie sur un site de contenu réel, trois cent cinquante articles, migré successivement sur les trois outils pour mesurer des différences autrement qu’à l’intuition. Astro, en pleine ascension, n’entre pas dans ce comparatif : il mérite un article à lui seul, qui viendra plus tard sur ce blog.
Le protocole du comparatif
Le même site WordPress, un blog culinaire de trois cent cinquante articles avec images, catégories et un système de recettes en type de contenu personnalisé, a été reconstruit à l’identique sur les trois plateformes, avec la même API REST comme source de données, sur la même machine de build (quatre cœurs, huit gigaoctets de mémoire).
Gatsby : la référence historique du secteur
Gatsby reste la solution la plus riche en plugins dédiés à WordPress, avec gatsby-source-wordpress qui construit un graphe GraphQL complet à partir de l’API REST ou de WPGraphQL. L’écosystème de plugins complémentaires (images optimisées, génération de flux RSS, PWA) est le plus mature des trois. Le temps de build, en revanche, se ressent sur un site de cette taille : la phase de récupération et d’indexation des données prend, à elle seule, plus de la moitié du temps total.
Next.js en export statique : la flexibilité contre la simplicité
Next.js, utilisé avec next export (avant qu’une prochaine évolution du framework ne redéfinisse ces mécanismes), demande davantage de code manuel pour orchestrer la récupération des données via getStaticProps et getStaticPaths, sans couche d’abstraction équivalente à celle de Gatsby. En contrepartie, il offre une bien plus grande liberté architecturale, en particulier pour mélanger pages statiques et fonctionnalités plus dynamiques sur un même projet.
Eleventy : la simplicité assumée
Eleventy ne propose aucune couche GraphQL ni système de plugins de données intégré : chaque template va chercher lui-même ses données via un appel direct à l’API REST, dans un fichier JavaScript de configuration. Cette absence d’abstraction, qui pourrait sembler être un manque, s’est révélée être l’atout principal d’Eleventy sur ce projet : moins de couches signifie moins de temps passé à indexer des données inutilement, et un temps de build nettement inférieur aux deux autres solutions.
// _data/articles.js
module.exports = async function () {
const reponse = await fetch(
'https://api.exemple.fr/wp-json/wp/v2/posts?per_page=100&_embed'
)
return reponse.json()
}
Les chiffres du comparatif
| Critère | Gatsby | Next.js (export) | Eleventy |
|---|---|---|---|
| Temps de build (350 articles) | 4 min 40 s | 2 min 55 s | 1 min 20 s |
| Courbe d’apprentissage | Modérée (GraphQL propre à Gatsby) | Modérée (React requis) | Faible (templates Nunjucks/Liquid) |
| Écosystème de plugins WordPress | Très riche | Restreint, tout est manuel | Quasi inexistant |
| Interactivité côté client | Complète (React) | Complète (React) | Nulle par défaut, à ajouter à la main |
| Adapté à un site sans interactivité | Surdimensionné | Surdimensionné | Parfaitement adapté |
Ce que ces chiffres ne disent pas à eux seuls
- Un site nécessitant de vraies fonctionnalités interactives (panier, espace membre, filtres dynamiques) ne devrait pas choisir Eleventy pour sa seule rapidité de build, sous peine de devoir tout recoder à la main pour l’interactivité que React offre nativement.
- L’écart de temps de build entre Gatsby et Eleventy se resserre sur un site de moins de cent articles, où la phase d’indexation GraphQL pèse proportionnellement moins.
- La maintenabilité à long terme dépend aussi des compétences déjà présentes dans l’équipe qui reprendra le projet, un critère que ce comparatif ne mesure pas.
Choisir un générateur statique sur la seule vitesse de build est une erreur aussi fréquente que choisir un framework sur la seule popularité de son étoile GitHub : le bon choix dépend d’abord de ce que le site doit réellement faire une fois construit.
En résumé
Pour un blog éditorial sans interactivité complexe, Eleventy s’est montré le plus rapide et le plus simple des trois sur ce comparatif, un résultat qui aurait surpris l’agence il y a encore deux ans. Gatsby garde une longueur d’avance pour un projet qui a besoin de son écosystème de plugins riche autour de WordPress, et Next.js reste le choix par défaut dès qu’un site mêle contenu statique et fonctionnalités plus dynamiques dans une même base de code.
