Update from older versions of the JavaScript (Browser) SDK

Describes how to update from older versions of the Optimizely Full Stack (Legacy) JavaScript (Browser) SDK to Optimizely Feature Experimentation.

Suggest Edits

This section provides code examples for how Optimizely recommends leveraging the new Decision and Event Tracking APIs. All existing Full Stack (Legacy) methods and implementation are still supported. See Optimizely Feature Experimentation - application & migration documentation for the latest updates.

Optimizely recommends adopting the new Decide, Decide All, and Track Event methods as a more flexible and easier-to-use replacement where you currently use isFeatureEnabled, getFeatureVariable, getAllFeatures, or Track calls within your implementation.

The following are examples of how to migrate the Full Stack (Legacy) methods to Feature Experimentation methods:

// -------------------------------
// Prereq for new methods: create a user
// ------------------------------
const attributes = {
  is_loggin_in: true
};
const user = optimizely.createUserContext('user123', attributes);


// -------------------------------
// Is Feature Enabled 
// ------------------------------
// old method
const enabled = optimizely.isFeatureEnabled('flag_1', 'user_123', attributes);

// new method
const decision = user.decide('flag_1');
const enabled = decision['enabled'];


// -------------------------------
// Activate & Get Variation 
// ------------------------------
// old method
const variationKey = optimizely.activate('experiment_1','user_123', attributes);

// new method
const variationKey = decision['variationKey'];


// -------------------------------
// Get All Feature Variables 
// ------------------------------
// old method
const allVarValues = optimizely.getAllFeatureVariables('flag_1', 'user_123');

// new method
const allVarValues = decision['variables'];


// -------------------------------
// Get Enabled Features 
// ------------------------------
// old method
const enabledFlags = optimizely.getEnabledFeatures('user_123');

// new method
const decisions = user.decideAll([OptimizelyDecideOption.ENABLED_FLAGS_ONLY]);
const enabledFlags = Object.keys(decisions);


// -------------------------------
// Track 
// ------------------------------
// old method
const eventTags = { purchase_count: 2 };
optimizely.track('my_purchase_event_key', 'user_123', attributes, eventTags);

// new method
user.trackEvent('my_purchase_event_key', eventTags);

Updated 2 months ago