User Context

The user context serves as a unique identifier for individual users and plays a critical role in ensuring consistent feature rollouts across sessions and devices. Typically represented as an object, the user context includes an id key that uniquely identifies the user.

In addition to the user ID, the context can incorporate various attributes to support advanced targeting and segmentation strategies. These may include:

• customVariables: User-specific data points for personalized experiences.

By leveraging these attributes, organizations can deliver precisely targeted features, maintain personalization consistency, and conduct granular experimentation for improved user engagement and performance analysis.

📘

Important Note

The user context attributes differ from the attributes set using the setAttribute API.

• User Context Attributes: Primarily used for targeting purposes during feature rollouts and experimentation. These attributes help determine which users are eligible for specific features or variations.
• setAttribute API Attributes: Specifically designed for post-segmentation analysis, allowing you to segment and analyze experiment results based on defined user characteristics.

🚧

Current Limitation

VWO does not support using user context attributes directly as post-segmentation filters in the reporting section of VWO applications. For post-segmentation, it is recommended to rely on attributes set via the setAttribute API.

Usage with VWOProvider

import React from 'react';
import { VWOProvider, IVWOOptions, IVWOContextModel } from 'vwo-fme-react-sdk';

const vwoConfig: IVWOOptions = {
  sdkKey: '32-alpha-numeric-sdk-key', // Your VWO SDK Key
  accountId: '123456', // Your VWO Account ID
  logger: {
    level: 'debug', // Optional log level for debugging
  },
};

const userContext: IVWOContextModel = {
  id: 'unique_user_id', // Required: Unique identifier for the user
  customVariables: { age: 25, location: 'US' }, // Optional
  userAgent:
    'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36', // Optional
  ipAddress: '1.1.1.1', // Optional
};

// Optional: Provide a fallback UI component that will be displayed while VWOProvider initializes.
// This is useful for showing a loading state or placeholder content during SDK initialization.
const fallbackComponent = <div>Initializing VWO...</div>;

const App = () => (
  <VWOProvider config={vwoConfig} userContext={ userContext } fallbackComponent={fallbackComponent}>
    <YourComponent />
  </VWOProvider>
);

export default App;

User Context keys

Usage with useGetFlag Hook

import { IVWOContextModel } from 'vwo-fme-react-sdk';

const userContext: IVWOContextModel = { id: 'unique_user_id' }
const { flag, isReady } = useGetFlag('feature_key', userContext);

Learn more about useGetFlag