A/B testing with Nuxt
Each experiment runs server-side via Nitro middleware. Variants are assigned before any HTML is sent. Zero flicker, zero client JS.
Nitro middleware active on /hero · /pricing · /demo-edge · /demo-combined
01
EDGE · LAYOUT
→Hero Layout Test
Two completely different page layouts behind the same URL. Nitro middleware rewrites /hero → /hero-b transparently. No JavaScript required.
- Control: Single-column — "Ship faster with data"
- Variant B: Two-column with feature cards — "Build what users actually want"
02
EDGE · CONTENT
→Pricing Page Test
Two entirely separate pricing pages at different URLs. The middleware sends half the traffic to /pricing-b transparently.
- Control: 3-tier grid (Free / Starter / Growth)
- Variant B: 2-tier with annual billing toggle
03
EDGE · URL REWRITE
→Edge Rewrite Explainer
Visual walkthrough of how Nitro middleware intercepts a request and rewrites the path server-side — browser sees no change.
- Control: Light page — steps on white background
- Variant B: Dark page — same steps, navy background
04
SDK · UTM
→SDK Button Style Test
No middleware rewrite — getVariant() is called inside the page component. Same URL, no cookies, variant driven by URL param.
- Control: Outlined button
- Variant B: Filled terracotta button — add ?utm_text=variation-1
Clear your cookies to be re-assigned. Edge experiments use a ky_ cookie. SDK experiments use URL params.