sfnext-hybrid-storefronts

name	sfnext-hybrid-storefronts
description	Implement hybrid storefronts that run Storefront Next alongside SFRA or SiteGenesis. Use when planning gradual migration from SFRA, configuring hybrid proxy for local development, setting up session bridging between storefronts, or routing traffic between old and new implementations.

Hybrid Storefronts Skill

This skill covers running Storefront Next alongside an existing SFRA or SiteGenesis storefront — enabling gradual migration without a full rewrite.

Overview

A hybrid storefront splits traffic between Storefront Next (for new or migrated pages) and an existing SFRA/SiteGenesis storefront (for pages not yet migrated). Session bridging ensures users maintain authentication and cart state across both implementations.

Architecture

Customer Request
      ↓
  CDN / eCDN (Cloudflare)        ← Production: routes based on URL patterns
      ↓
  ┌─────────────────────────────┐
  │ Storefront Next │ SFRA/SiteGenesis │
  │  (MRT)          │  (B2C Instance)  │
  └────────┴────────────────────┘
       ↕ Session Bridge (shared cookies) ↕

Production: Cloudflare eCDN handles routing between Storefront Next and SFRA based on origin rules.

Local Development: A Vite dev server plugin (hybridProxyPlugin from @salesforce/storefront-next-dev) proxies non-matching requests to your SFCC sandbox, simulating the eCDN split at localhost:5173.

Configuration

Hybrid mode is configured entirely through environment variables — there is no extension directory.

Application Config (All Environments)

These PUBLIC__ variables are bundled into the app and required in all environments:

# Enable hybrid mode — activates the client-side legacy-routes middleware
PUBLIC__app__hybrid__enabled=true



PUBLIC__app__hybrid__legacyRoutes=