Guides
Github RepositoryGo to Docs (KR)Sign in to Dashboard

Traffic Distribution

Suggest Edits

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 or useLoadableVariation

You can use components provided by Hackle or use Hooks API to distribute users/traffic to specific test 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.

import {HackleExperiment, HackleVariation} from '@hackler/react-native-sdk';

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"}> // Logic for the assigned test group
        <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 />
}


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 { loaded, result } = useLoadableVariation(42)

  // Component unexposed before SDK Loading - Example
  if (!loaded) return null

  // Logic for the assigned test group
  if (result === "A") return <AwesomeFeature />
  if (result === "B") return <SuperAwesomeFeature />
  return <AwesomeFeature />
}

useVariationDetail or useLoadableVariationDetail

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

// Traffic distribution details - Loadable 
const { loaded, result } = useLoadableVariationDetail(42)

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

// Reason for distribution to a test group
const reason = result.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
NOT_IN_EXPERIMENT_TARGETUser does not qualify as the target user for the A/B test.(control) Test Group A
TRAFFIC_NOT_ALLOCATEDThe user is qualified as a target user of the A/B test but is not included as a part of the traffic.(control) Test Group A
TRAFFIC_ALLOCATEDUser has been assigned to an A/B test.Assigned test group
VARIATION_DROPPEDTest group has been removed 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

νŒŒλΌλ―Έν„°

  • useVariationDetail() Hooks APIλ₯Ό 톡해 λΆ„λ°°λœ 그룹의 νŒŒλΌλ―Έν„° 값도 같이 μ œκ³΅λ°›μ„ 수 μžˆμŠ΅λ‹ˆλ‹€.
  • config 객체와 getSync() λ©”μ†Œλ“œλ₯Ό 톡해 A/B ν…ŒμŠ€νŠΈ ν™”λ©΄μ—μ„œ μ„€μ •ν•œ νŒŒλΌλ―Έν„° μ„€μ • 값을 λ°›μ•„ ν™œμš©ν•  수 있으며 A/B ν…ŒμŠ€νŠΈμ˜ νŒŒλΌλ―Έν„° μ„€μ • ν™”λ©΄μ—μ„œ 값을 λ³€κ²½ν•  경우, λ³€κ²½λœ 값이 μ½”λ“œμ— μ μš©λ©λ‹ˆλ‹€.

πŸ“˜

νŒŒλΌλ―Έν„° 섀정은 SDK 버전 3.3.0 이상인 경우 μ‚¬μš© κ°€λŠ₯ν•©λ‹ˆλ‹€.

// Distribution Decision Detail
const decision = useVariationDetail(42)

// Get parameter value through getSync() method in distribution decision detail
const parameterValue = decision.getSync("parameterKey", "defaultValue")

// Get the config information with all parameter setting values in the distribution decision detail
const config = decision.config

// Get parameter value from config information
const configParameterValue = config.getSync("parameterKey", "defaultValue")

// Example of string type parameter value
const strValue = decision.getSync("parmeterKey", "defaultValue")
const strValueInConfig = config.getSync("parmeterKey", "defaultValue")


// Distribution Decision Detail - Loadable case
const { loaded, result } = useLoadableVariationDetail(42)

// Get parameter value through getSync() method in distribution decision detail
const parameterValue = result.getSync("parameterKey", "defaultValue")

// Get parameter value through getSync() method in distribution decision detail
const config = result.config


// Get the config information with all parameter setting values in the distribution decision detail
const configParameterValue = config.getSync("parameterKey", "defaultValue")


// Example of string type parameter value
const strValue = result.getSync("parmeterKey", "defaultValue")
const strValueInConfig = config.getSync("parmeterKey", "defaultValue")
  • The parameterKey of the getSync() method is the key information set in the a/b test parameter setting, and the defaultValue is the value returned when the state decision fails or when an incorrect parameter type value is entered.
  • To properly receive the set information, it is necessary to enter a value of the same type as the parameter type set for defaultValue.
  • JSON type can be received in string form, so for JSON type, defaultValue must be entered as a string type.
  • The parameter types provided by the SDK are string, number, boolean and JSON type set in the feature flag screen can be received in the form of a string. The default value of the JSON type must be entered as a string type.

Updated 12 months ago