Headless WordPress to architektura, w ktorej WordPress jest uzywany wylacznie jako CMS i API tresci, a publiczny frontend buduje sie odrebnym stosem technologicznym. Klasyczna warstwa motywu (PHP, hierarchia szablonow, jQuery) zostaje usunieta, a aplikacja frontendowa pobiera tresc przez WordPress REST API (od WordPress 4.7, grudzien 2016) lub przez endpoint GraphQL z wtyczki WPGraphQL (ponad 60.000 instalacji w 2025). Popularne frameworki: Next.js (React, Vercel), Astro, Nuxt (Vue), SvelteKit, Gatsby, Remix, Eleventy, Hugo. Frontend deployuje sie osobno, czesto jako statyczne HTML na CDN (Vercel, Netlify, Cloudflare Pages, AWS Amplify) lub jako Node.js na edge.
Roznica wzgledem klasycznego WordPressa
- Odwiedzajacy otwiera
https://shop.example.pl. - Frontend woła
https://cms.example.pl/wp-json/wp/v2/posts. - WordPress oddaje JSON.
- Frontend renderuje strone i wysyla HTML plus maly bundle JS.
API
| API | Format | Plusy | Minusy |
|---|---|---|---|
| WordPress REST API | JSON | Wbudowane | Wiele round tripow |
| WPGraphQL | GraphQL | Tylko potrzebne pola | Wtyczka, trudniejsze cache HTTP |
Zalety
- Wydajnosc.
- Lepsze Core Web Vitals.
- Nowoczesne narzedzia developerskie.
- Mniejsza powierzchnia ataku.
- Multi kanal.
- Skalowanie ISR.
- Edytor bez zmian.
Wady
- Wyzsze koszty.
- Podglad WYSIWYG popsuty.
- Wtyczki HTML niedzialaja.
- SEO recznie.
- Dlugie buildy.
- Komentarze i formularze custom.
- Drozsi developerzy React.
Popularne frameworki
- Next.js, Astro, Nuxt, SvelteKit, Gatsby, Eleventy, Remix.
Hosting
- Backend: Kinsta, WP Engine, Cloudways. Plany: WP Engine Atlas, Kinsta Headless, Pantheon Decoupled.
- Frontend: Vercel, Netlify, Cloudflare Pages, AWS Amplify, Render, Railway, Fly.io.
Przyklad Next.js i WPGraphQL
async function getPosts() {
const res = await fetch('https://cms.example.pl/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;
}Kiedy NIE wybierac Headless
- Male witryny bez problemow wydajnosciowych.
- Zespol bez React/Vue.
- Silna zaleznosc od page builderow.
- Wiele wtyczek wstrzykujacych HTML.
- WooCommerce z zlozonym checkoutem.
SEO
SSR lub SSG. Mapowanie title, meta description, canonical, Open Graph, Twitter Card, sitemap, robots.txt i JSON-LD.
Jak InspectWP pomaga?
InspectWP wykrywa CDN po naglowkach x-vercel-id, x-nf-request-id, cf-ray.