Knowledge · WordPress Web Design
WordPress FSE Block Themes: Why We Stopped Using Page Builders
WordPress shipped Full Site Editing in 5.9 (January 2022). For 18 months we kept building on Elementor anyway, because FSE wasn’t ready. In late 2023 it was. We migrated our toolchain. Page weight dropped 60%. LCP dropped from 2.8s to 1.2s. Plugin count dropped from 17 to 5. Here’s what changed and why we don’t look back.
№ 01What FSE actually changed
Before FSE, a WordPress theme controlled the ‘chrome’ (header, footer, sidebars) but page content lived in the editor — usually a page builder. The chrome was PHP templates, the content was builder shortcodes. Two parallel systems.
FSE collapses both into the block editor. The header is blocks. The footer is blocks. Page templates are blocks. Design tokens (colors, fonts, spacing) live in theme.json — a single source of truth the editor and the front-end both read. No builder plugin in the middle.
The result: the editor produces near-final HTML. No layout engine on the front-end. No 800KB JavaScript shim. The browser just renders semantic HTML and CSS.
№ 02The performance delta is not marginal
A 40-page Elementor site we audited in late 2024: 2.4MB average page weight, 3.6s LCP, 17 active plugins, Lighthouse Performance 42. The owner thought the site was ‘fast.’
The same site rebuilt as FSE block theme: 680KB average page weight, 1.3s LCP, 5 active plugins, Lighthouse 94. Same content. Same design. Different engine.
The performance gain isn’t from being clever — it’s from removing the abstraction layer. Page builders ship a layout engine to every visitor. FSE doesn’t.
№ 03Theme.json is the unlock
The piece that makes FSE work for agencies is theme.json. It defines the design system — color palette, font families, spacing scale, layout widths, block defaults — in one file. The editor reads it. The front-end reads it. Block patterns inherit from it.
This means a client can edit blocks without breaking the design. Spacing stays consistent because the spacing values come from the system. Colors stay on-brand because the palette is the palette. There’s no ‘the editor lets me pick any hex code and now we have 47 grays’ problem.
For us, this is the single biggest reason we trust FSE for client work. The guardrails are real.
№ 04Where FSE still hurts
The block editor is more abstract than Elementor for non-technical editors. Concepts like ‘Group block’ vs ‘Stack block’ vs ‘Row block’ take a session to internalize. Clients who could drag-and-drop in Elementor sometimes struggle with FSE’s constraints.
The fix is pattern libraries. We ship every client site with 20-40 pre-built block patterns — hero variants, feature grids, testimonial blocks, CTA sections. The client picks a pattern, edits text, replaces images. The structural decisions are pre-made. That replicates the page-builder editing experience while keeping FSE’s performance benefits.
The other rough edge: third-party block plugins are inconsistent quality. We stick to core blocks plus the official Gutenberg blocks plus 1-2 trusted block libraries (GenerateBlocks Pro is the one we recommend).
№ 05Our FSE build stack
Theme: custom block theme built from scratch, no parent theme. theme.json with full design tokens. 20-40 block patterns per site.
Plugin stack: Rank Math (SEO), Gravity Forms or Fluent Forms (forms), Wordfence or Solid Security (security), Updraft or BlogVault (backups), WP Rocket (cache), GenerateBlocks Pro (extra block patterns). That’s 6. Sometimes we add Advanced Custom Fields Pro if there’s custom-field complexity. Never more than 8.
PHP 8.2+ required. MySQL 8 or MariaDB 10.6+. Hosted on Kinsta, Cloudways Vultr HF, or WP Engine. No shared hosting.
⚠What to avoid
- Migrating from Elementor to FSE without rebuilding from scratch. The Elementor markup doesn’t convert cleanly to blocks. You’ll spend more time fixing the conversion than rebuilding properly.
- Treating FSE as ‘Gutenberg with extra steps.’ It’s not. It’s a different model. Sites built without theme.json discipline end up with the same plugin sprawl as Elementor builds.
- Adding a block-library plugin for every missing pattern. Stick to one (GenerateBlocks Pro) or build the patterns custom in your theme. Mixing 3-4 block plugins recreates the page-builder bloat problem.
Related questions
Go deeper
Three Ways to Start · No Sales Pitch
Want this analyzed on your site?
$500 audit. 5-day delivery. Refundable on engagement.
