WordPress Headless est une architecture ou WordPress sert uniquement de systeme de gestion de contenu (CMS) et d API, tandis que le frontend public est construit avec une pile distincte. La couche de theme classique (PHP, hierarchie des modeles, jQuery) est retiree ou ignoree, et l application frontend recupere les contenus via la REST API WordPress (presente depuis WordPress 4.7 en decembre 2016) ou via le endpoint GraphQL fourni par WPGraphQL (plus de 60 000 installations en 2025). Frameworks populaires : Next.js (React, par Vercel), Astro, Nuxt (Vue), SvelteKit, Gatsby, Remix, Eleventy, Hugo. Le frontend est deploye separement, souvent en HTML statique sur un CDN (Vercel, Netlify, Cloudflare Pages, AWS Amplify) ou en Node.js sur l edge. Les facteurs de adoption : chargements plus rapides, meilleurs Core Web Vitals, experience developpeur moderne et publication multi canal.
Difference avec WordPress classique
- Visiteur ouvre
https://shop.example.fr(frontend Next.js sur Vercel). - Le frontend appelle
https://cms.example.fr/wp-json/wp/v2/posts. - WordPress renvoie du JSON.
- Le frontend rend la page et envoie HTML et un petit bundle JS.
APIs utilisees
| API | Format | Avantages | Inconvenients |
|---|---|---|---|
| WordPress REST API | JSON | Integree, sans plugin | Plusieurs requetes pour donnees liees |
| WPGraphQL | GraphQL | Champs au choix, typage | Plugin requis, cache HTTP difficile |
Avantages
- Performance, statique au edge en 20 a 80 ms.
- Core Web Vitals meilleurs.
- Experience dev moderne.
- Surface d attaque reduite.
- Multi canal.
- Mise a l echelle via ISR.
- Editeur inchange.
Inconvenients
- Cout plus eleve.
- Apercu WYSIWYG casse.
- Plugins qui injectent du HTML casses.
- SEO manuel.
- Temps de build long.
- Commentaires et formulaires a refaire.
- Developpeurs React plus chers.
Frameworks
- Next.js, Astro, Nuxt, SvelteKit, Gatsby (rachat Netlify fevrier 2023), Eleventy, Remix (fusionne avec React Router 7 en novembre 2024).
Hebergement
- Backend : Kinsta, WP Engine, Cloudways. Offres dediees : WP Engine Atlas, Kinsta Headless, Pantheon Decoupled.
- Frontend : Vercel, Netlify, Cloudflare Pages, AWS Amplify, Render, Railway, Fly.io.
Exemple avec Next.js et WPGraphQL
async function getPosts() {
const res = await fetch('https://cms.example.fr/graphql', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ query: `{ posts(first: 10) { nodes { title slug } } }` }),
next: { revalidate: 60 },
});
return (await res.json()).data.posts.nodes;
}Quand ne pas faire du Headless
- Petit site sans probleme de performance.
- Equipe sans React ou Vue.
- Dependance forte aux page builders.
- Beaucoup de plugins qui injectent du HTML.
- WooCommerce avec checkout complexe.
SEO
SSR ou SSG pour avoir du contenu HTML des le premier rendu. Mapper title, meta description, canonical, Open Graph, Twitter Cards, sitemap, robots.txt et JSON-LD.
Comment InspectWP aide ?
InspectWP detecte les CDN (Vercel, Netlify, Cloudflare) via les en-tetes x-vercel-id, x-nf-request-id, cf-ray.