Observatory dispatch

WordPress with React: choosing the right boundary

WordPress already uses React extensively in the block editor. A custom block can provide a React editing interface while saving semantic HTML that PHP renders on the public site. This is often the strongest integration point: editors receive a modern component experience, visitors receive fast, resilient markup, and the content remains portable.

Three architectures

  • Native block theme: WordPress renders templates and content. React powers selected editor blocks or interactive islands.
  • Decoupled interface: WordPress remains the CMS while a React application consumes the REST API or GraphQL.
  • Headless Next.js: Next.js controls routing, rendering and caching, with WordPress acting primarily as the editorial backend.

Performance is a delivery decision

React is not automatically faster than PHP. A small server-rendered WordPress page can outperform a JavaScript-heavy frontend. React earns its place when interaction complexity benefits from a component state model. Performance improves when the architecture sends less JavaScript, optimises images, caches predictable output and avoids repeated client-server waterfalls.

SEO depends on rendered content

Search visibility benefits from meaningful HTML, stable URLs, useful metadata, internal linking and fast delivery. Server rendering or static generation can make a decoupled React site search-friendly, but it adds preview, cache invalidation and deployment concerns that a native WordPress theme already solves.

A practical default

For service sites, publications and moderate commerce, I prefer a custom block theme with React used deliberately for authoring tools and genuinely interactive features. A headless build becomes attractive when the public application has substantial product behaviour, multiple content consumers or deployment requirements that justify the additional moving parts.

The right question is not “React or PHP?” The useful question is where each technology gives the project a clearer boundary, a smaller operational burden and a better experience.