Poor intrusive way to make A/B Testing by using an HoC instead of components.
Usage
Installation
$ npm install --save rn-ab-hoc
Component
/* list.js */
import abConnect from 'rn-ab-hoc';
import FlatList from './flatList.js';
import ListView rom './listView.js';
import OtherList rom './otherList.js';
export default abConnect('ListExperiment',
{ variant: 'FlatList', component: FlatList },
{ variant: 'ListView', component: ListView },
{ variant: 'OtherList', component: OtherList }
);The previous code defines :
- An experiment name
- A list of different variants with their names and associated components
Using a random variant
/* app.js */
import React from 'react';
import List from './list';
export default function App() {
return (
<List />
);
}This will load one of the three previous components (variants) defined using a randomize function
Forcing a variant
/* app.js */
import React from 'react';
import List from './list';
export default function App() {
return (
<List variant="FlatList" />
);
}This will force a specific variant (maybe sent by your backend) to be used inside the app.
Note that the forced variant takes over the random one. If you set a variant by forcing it, the previous random one will be erased and replaced by the forced one. Inverse is not true.
Which variant am I using ?
/* app.js */
import React from 'react';
import List from './list';
export default function App() {
return (
<List
variant="FlatList"
onVariantSelect={(variant) => console.log(variant)}
/>
);
}This will print FlatList. It also work with random variants.
Storage
The default storage system is AsyncStorage with a key that follows the pattern :
abhoc-variant-${experiment}In the previous case, it would have been :
abhoc-variant-ListExperiment