Hanskumar Tripathi
Aug 13, 2026
visibility 538
star star star star star
(0 votes)

You’re not headless. You’re hybrid — and that’s the CMS 12 default.

For CMS 12 / Commerce teams with a React (or similar) storefront who keep hearing “just go headless” or “just move to Graph.” This is Part 1 of Find → Graph: the hybrid storefront.

Optimizely CMS 12 sites that look “headless” in the browser are usually hybrid.

Editors still work in the CMS. Catalog still lives in Commerce. Preview and on-page edit still need a server-rendered page. React (or similar) is a storefront shell, not the system of record.

If you skip that, CMS 13 + Optimizely Graph feels like a frontend rewrite. It isn’t. Graph replaces Search & Navigation (Find) as the query/index layer.

It does not replace:

  • Content types and IContentRepository
  • Commerce catalog, pricing, and cart
  • Edit mode and preview
  • Your React / SSR host

Three layers people mix up

Layer CMS 12 today After Graph / CMS 13
Authoring CMS UI, content types Still CMS
Storefront Razor + React / Content Delivery API Same hybrid, or more CDA
Search and listings Find (IClient, facets, conventions) Optimizely Graph

Content Delivery API is content over HTTP. Find/Graph is query, facet, rank, and index. Using CDA as your product-listing search is how teams paint themselves into a corner.

A hybrid shape that survives Graph

  1. CMS/Commerce owns content and catalog.
  2. A thin .NET host does auth, cart, preview, and first paint (SSR).
  3. React hydrates listing / PDP / checkout islands.
  4. Listings talk to a query module (IProductSearch, IPageSearch) — not IClient in 40 controllers.

That last point is the migration. Find behind a port → Graph is an adapter. Find in every controller → Graph is a rewrite.

public interface IProductSearch
{
    Task<ProductSearchResult> SearchAsync(
        ProductSearchRequest request,
        CancellationToken cancellationToken);
}

// CMS 12: Find adapter implements this.
// CMS 13: Graph adapter implements this.
// Controllers and React never take a dependency on IClient.

Do this before

  • Draw the line: CDA vs Find vs IContentLoader.
  • Put Find behind interfaces (search, facets, paging).
  • Don’t let React own search URLs the server doesn’t know.
  • Measure three numbers: time from publish until the listing shows the new item in Find; listing p95; percent of searches with zero hits.

This is Part 1 of Find → Graph: the hybrid storefront. Next: typed Find query builders, facets, and GetContentResultAsync — so a Graph adapter can sit beside them later.

Aug 13, 2026

Comments

error Please login to comment.
Latest blogs
Building UI Extensions for Optimizely SaaS CMS

Introduction Developers have been extending the functionality of Optimizely PaaS CMS for years using addons built in C# and deployed as NuGet...

Mark Stott | Oct 15, 2026

Cheapskate AI Translator: Because Translation Should Not Require a Second Mortgage

There is a particular kind of software project that begins with a detailed architecture document, a product roadmap, and a carefully assembled...

Linh Doan Cuu | Oct 15, 2026

Computed Fields in CMS 13 Content Contracts with Optimizely Graph

Content Contracts in Optimizely CMS 13 allow different content types to share a common structure when querying Optimizely Graph. But what if the...

Mardy | Oct 14, 2026

Opal Workflow Agents And The Graph Webhook Trap

What we did? We built a compliance review workflow agent in Opal. The job was simple: when an editor submits a page for review in Optimizely CMS 13...

Ritu Madan | Oct 14, 2026