Next.js A/B testing

Next.js A/B testing that respects client-side navigation

Load Otter once in the root layout, then let the SDK re-evaluate experiments as App Router or Pages Router navigation changes the URL.

Start a free testSee how Otter works

Install location

app/layout.tsx or pages/_document.tsx

One shared installation powers every experiment, conversion goal, and report on this site.

  1. 01Add the Otter SDK with the Next.js Script component.
  2. 02Place the anti-flicker style in the shared document head.
  3. 03Verify the deployment and create URL rules for the routes under test.

Ideas

What to test on Next.js

Start with the changes closest to the money. These are the ones teams on this platform run first.

App Router pages
Pages Router sites
SPA route experiments
Custom React event goals

Questions

Next.js A/B testing questions

Does Otter work with the Next.js App Router?

Yes. Install the Script component in app/layout.tsx and Otter will detect client-side history changes.

Can I track React interactions as goals?

Yes. Call optimo.track from your event handler, or configure click goals directly in Otter.

Does Otter require a server-side Next.js SDK?

No. Website experiments use the lightweight browser SDK; split URL tests can still route visitors to server-rendered variants.

Built for Next.js

Run your first test this afternoon

One snippet, no build step, and results you can act on within days.

Start free trialSee pricing
  • 14-day free trial
  • No credit card required
  • Cancel anytime