Version.Compare React

This service is still in private alpha.

Version Compare is a service to test variants of your components and optimize for conversion. It uses a multi-armed bandit in the background, and will try to show your users whichever version that converts the best.

Usage:

import VersionCompare from '@versioncompare/react';

function App() {
  ...
  return (
    <VersionCompare experimentId="<name of your experiment>" variants={{
      variant_id: <p>A</p>,
      other_id: () => <p>B</p>,
    }}>
      Optional default content shown until a decision has been made
    </VersionCompare>
  )
}

As you can see in the example above, the variants can either be a ReactNode or a zero-arity function producing a ReactNode. You can provide as many or as few variants as you want and change them as you go. Version Compare will give every variant a fair amount of exposure, and then optimize toward the version it sees performing best over time.

Additionally, you need to include a script tag in your page header:

<script defer type="text/javascript" src="https://cdn.version.compare/assets/embed.js" data-siteid="<YOUR ID>" is:inline></script>

This script will ensure the success of the variants can be tracked (i.e., someone subsequently subscribed to your service after having seen a specific variant).

You need to replace <YOUR ID> with your Version Compare site id that you get when signing up.