Traffic Distribution

Distribute your traffic into different test groups of your A/B test.

When conducting an A/B test, not only do you need to distribute your users to different test groups, you also need to write a logic for each test group. After the integration stages, the distribution of users into different test groups can be done through the Hackle SDK.

πŸ“˜

Test Groups

The test groups are basically the different groups that are exposed to the versions (features, screens, algorithms, etc) of a page of an experiment. Test Groups include both the control test group A and treatment test groups B, C, D, etc., that are exposed to the "improved" versions of the pages.
The test groups can be set on the dashboard and further information on the test groups can be found on the What is a Test Group? document.

useVariation

You can use components provided by Hackle or use Hooks API to distribute users to specific groups and receive distribution results. When distributing, you must pass the experiment key.

In the example code below, we are passing the experimental key 42, and there are two test groups, A and B.

function App() {
  return (
    // Determines the test group to assign the user in an A/B tests with an experiment key of 42.
    // For undetermined cases, the user is returned to test group A. 
    <HackleExperiment experimentKey={42}> 
      <HackleVariation variation={"A"}>
        <AwesomeFeature />
      </HackleVariation>
      <HackleVariation variation={"B"}>
        <SuperAwesomeFeature />
      </HackleVariation>
    </HackleExperiment>
  )
}
function App() {
  // Determines the test group to assign the user in an A/B tests with an experiment key of 42.
  // For undetermined cases, the user is returned to test group A. 
  const variation = useVariation(42)
  
  // Logic for the assigned test group.
  if (variation === "A") return <AwesomeFeature />
  if (variation === "B") return <SuperAwesomeFeature />
  return <AwesomeFeature />
}

useVariationDetail

The useVariationDetail() Hooks API works the same as useVariation() but provides the reason for a user being distributed to a specific group. This method can be a useful tool to see if the distribution is working properly.
You must pass the experiment key as a parameter. For the example code below, we are passing experimental key 42.

// Traffic distribution details 
const decision = useVariationDetail(42)

// Test group determined from distribution
const variation = decision.variation

// Reason for distribution to a test group
const reason = decision.reason

You will receive the reason for the distribution or the allocation of a specific user to a specific test group in the form of SDK_NOT_READY. Please refer to the table below for the full list of different distribution reasons.

ReasonDescriptionDistribution Result
SDK_NOT_READYThe SDK is not ready to use.
(e.g. Initialization with the wrong SDK key)
(control) Test Group A
EXPERIMENT_NOT_FOUNDNo A/B tests were found for the experimental key you passed.
The experiment key may be incorrect or the experiment may be in archive status.
(control) Test Group A
EXPERIMENT_DRAFTThe A/B test has not yet been started.(control) Test Group A
EXPERIMENT_PAUSEDThe A/B test has been paused.(control) Test Group A
EXPERIMENT_COMPLETEDThe A/B test has ended.Final winning test group from the experiment
OVERRIDDENUsers are determined to a specific group by manual assignment.Manually assigned test group
TRAFFIC_NOT_ALLOCATEDThe A/B test is running, but no user has been assigned to any group in the experiment yet.(control) Test Group A
TRAFFIC_ALLOCATEDThe user has been assigned to an A/B test.Assigned test group
VARIATION_DROPPEDThe test group has been excluded from the experiment.(control) Test Group A
INVALID_INPUTThe input value is not valid.
(e.g. A number was entered in a parameter that requires a character)
(control) Test Group A
EXCEPTIONAn unknown error has occurred.(control) Test Group A

Parameter

  • Parameter values of the distributed group can also be provided through the variationDetail() method.
  • Through the config object and the get() method, you can receive and use the parameter setting value set in the dashboard, and if you change the value in the A/B test parameter setting tab, the changed value is applied to the code.

πŸ“˜

Parameter setting is only available for SDK version 11.3.0 or higher.

// Traffic distribution details
const decision = useVariationDetail(42)
// or const { isLoading, decision } = useLoadableVariationDetail(42)

// Get parameter value through get() method in traffic distribution details
const parameterValue = decision.get("parameterKey", "defaultValue")

// Get config information with full parameter setting values in traffic distribution decision details
const config = decision.config

// Same result value as decision.get() above
const configParameterValue = config.get("parameterKey", "defaultValue")

// Example of string type parameter value
const strValue = decision.get("parmeterKey", "defaultValue")
const strValueInConfig = config.get("parmeterKey", "defaultValue")
  • The parameterKey of the get() method is the key information set in A/B Test Parameter Settings and the defaultValue is the value returned when the distribution decision fails or when the wrong parameter type is entered.
  • In order to properly receive the information you set in the dashboard, you must enter a value corresponding to the parameter type of defaultValue you set in the dashboard.
  • JSON type is received in the form of a string, so in the case of JSON type, the defaultValue must be entered as a string type.
  • The parameter types supported by SDK are string, number, and boolean. JSON types set in the dashboard can be received in the form of String. The default value of the JSON type must be entered as a string type.