Simple A/B testing component for React.
npm install react-split-testing     
> A/B testing, also called split testing, is an experiment where two (or more) variants of a webpage are shown to users at random, and is used as a means of determining which variant leads to a better performance. Once a variant wins, it is then shown to all users.
Wrap components in
``js`
Version A
Version B
#### npm
`bash`
npm install react-split-testing
#### yarn
`bash`
yarn add react-split-testing
`jsx
import { Experiment, Variant } from 'react-split-testing'
class App extends Component {
render() {
return (
name="My experiment"
onChoice={(experimentName, variantName) => console.log(experimentName, variantName)}
>
Section A
Section B
)
}
}
`
---
property will choose a consistent suitable for server side rendering.#### Example
`jsx
import { Experiment, Variant } from 'react-split-testing'class App extends Component {
render() {
return (
Section A
Section B
)
}
}
`---
API Reference
$3
.* Properties:
*
name - Name of the experiment.
* Required
* Type: string
* Example:
* - Distinct user identifier. Useful for server side rendering.
* Optional
* Type: string
* Example:
* - Name of the variant. When defined, this value is used to choose a variant. This property may be useful for server side rendering.
* Optional
* Type: string
* Example:
* - Called when a Variant has been chosen for your Experiment.
* Optional
* Type: function
* Example:
* - Same as onChoice, but the objects passed are React component instances.
* Optional
* Type: function
* Example: * Methods:
*
- Returns the Experiment name.
* getActiveVariant() - Returns the currently displayed Variant.
* getActiveVariantName() - Returns the currently displayed Variant name.
* getVariant(variantName) - Returns the instance of the specified Variant name.---
$3
Variant container component.
* Properties:
*
name - Name of the variant.
* Required
* Type: string
* Example:
* - The variants will be chosen according to the ratio of the numbers, for example variants A, B, C with weights 1, 2, 2 will be chosen 20%, 40%, and 40% of the time, respectively.
* Optional
* Type: number
* Default:
* Example: * Methods:
*
- Returns the Variant name.
* getWeight() - Returns the Variant` weight.---