Migrating from Optimizely Classic to Optimizely X

Optimizely X comes with a brand new JavaScript API. The API comes with improved performance and added features. We also incorporated all the new features that Optimizely X offers into the new JavaScript API (like Pages).

There are two pieces in migrating your JavaScript code from Optimizely Classic to Optimizely X:

  1. Reading data from the Optimizely object on the page
  2. Controlling the execution of Optimizely with functions

Both pieces are fairly similar in Optimizely X and Optimizely Classic, but there are some nuances that changed. In cases where it was possible, we implemented a legacy function so that your application will continue to work. In some cases, a small change will be required if you migrate from Optimizely Classic to Optimizely X due to new features that were added.

When you Optimizely snippet is in "Bundled" mode it means that Optimizely Classic is active as well as Optimizely X. The functions that work in both platforms will execute for both Optimizely Classic as well as Optimizely X in a bundled state.

Changed functions / properties

All of these functions require your attention when you are migrating from Optimizely Classic to Optimizely X:

If you are using a function in this list, please look at the function specific section below to get more information.

Properties

In Optimizely X, all of the properties are accessible through functions. From a performance point of view, this is a huge improvement, but it does change the structure of how data is accessible. Below is an overview of how to access data that you had access to in Classic with the Optimizely X JavaScript API.

If Optimizely snippet is in a bundled state you can access all your Classic data through the Classic JS API and Optimizely X data through the Optimizely X JS API.

State

Available in Optimizely X: Yes, but in a different format.

Classic format:

window["optimizely"].data.state

Optimizely X format:

window["optimizely"].get("state")

The state object contains information about the current state of Optimizely on the page. In Optimizely Classic the state object contained properties that contain information about which experiments are active, which variations a visitor is seeing at the moment and if a redirect Experiment has executed on the previous page. All that information is accessible in Optimizely X with the window["optimizely"].get("state") function. In Optimizely Classic, the state object contains function instead of properties. With the functions that are returned, you can specify filters. All the same information is available through those methods.

Read more about the available methods here.

Visitor

Available in Optimizely X: Yes, but in a different format.

Classic format:

window["optimizely"].data.visitor

Optimizely X format:

window["optimizely"].get("visitor")

The visitor object contains information about what Optimizely knows about the current visitor. In Optimizely X, that same information (and more) is accessible through the window["optimizely"].get("visitor") function.

Read more about visitor object here.

Data

Available in Optimizely X: Yes, but in a different format.

Classic format:

window["optimizely"].data

Optimizely X format:

window["optimizely"].get("data")

The data object in Optimizely Classic contained all the information that you could read. In Optimizely classic, state data and visitor information was nested in the data object. In Optimizely X that is separated out into new functions (see above). All the static data that used to be in window["optimizely"].data is accessible with window["optimizely"].get("data"). The object that is returned contains information about all the Campaigns, Experiments, Audiences, Pages and Events that are published in your Optimizely project.

Read all about the new data object here.

Revision

Available in Optimizely X: Yes, but in a different format.

Classic format:

window["optimizely"].revision

Optimizely X format:

window["optimizely"].get("data").revision

The revision number is accessible through window["optimizely"].get("data").revision.

Get account ID

Available in Optimizely X: Yes, but in a different format.

Classic format:

window["optimizely"].getAccountId()

Optimizely X format:

window["optimizely"].get("data").accountId

In Optimizely X the account ID is stored in the data Object. You can access the account ID with window["optimizely"].get("data").accountId.

Get project ID

Available in Optimizely X: Yes, but in a different format.

Classic format:

window["optimizely"].getProjectId()

Optimizely X format:

window["optimizely"].get("data").projectId

In Optimizely X the project ID is stored in the data Object. You can access the project ID with window["optimizely"].get("data").projectId.

Functions

Activate

Available in Optimizely X: Yes, but in a different format.

Classic format:

window["optimizely"].push(["activate"]);

Optimizely X format:

window["optimizely"].push({
  "type": "activate"
});

In Optimizely Classic, the activate function is used to activate all manually activated experiments. In Optimizely X activation happens at the page level.

Due to the different nature of the activate function, the activate function as it was available in Optimizely Classic doesn’t work for Optimizely X. Instead, there is a new function Optimizely X for window["optimizely"].push({type: "activate"});. The functions differs from the activate function in Optimizely Classic but has the same goal. The difference is that the entire Optimizely execution cycle is (re)activated.

You can read more about the new activate method here.

Activate a single experiment

Available in Optimizely X: Yes, but in a different format.

Classic format:

window["optimizely"].push(["activate", experimentId]);

Optimizely X format:

window["optimizely"].push({
  "type": "page",
  "pageName": "watchedVideo",
});

In Optimizely Classic, the activate function is used to activate one manually activated experiment. In Optimizely X activation happens at the page level. By activating a page, all associated experiments and campaigns are activated.

In Optimizely X you can manually activate a page with the Page function.

Activate SiteCatalyst

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push("activateSiteCatalyst");

Optimizely X format:

// It's exactly the same format
window["optimizely"].push("activateSiteCatalyst");

Continues to work in Optimizely X.

Activate SiteCatalyst with sVar

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["activateSiteCatalyst", {"sVariable": mySVar}]);

Optimizely X format:

// It's exactly the same format
window["optimizely"].push(["activateSiteCatalyst", {"sVariable": mySVar}]);

Continues to work in Optimizely X.

Audiences

Available in Optimizely X: No

Classic format:

window["optimizely"].push(['addToAudience', audienceId]);
window["optimizely"].push(['removeFromAudience', audienceId]);
window["optimizely"].push(['removeFromAllAudiences']);

Not available. There will be an alternative for these functions available solution soon.

Bucket Visitor by variation ID

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["bucketVisitor", experimentId, variationId]);

Optimizely X format:

window["optimizely"].push({
  "type": "bucketVisitor",
  "experimentId": "6661191859",
  "variationId": "238497929"
});

Continues to work in Optimizely X.

Bucket Visitor by variation index

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["bucketVisitor", experimentId, variationIndex]);

Optimizely X format:

window["optimizely"].push({
  "type": "bucketVisitor",
  "experimentId": "6661191859",
  "variationIndex": 1
});


Continues to work in Optimizely X.

Custom Tag

Available in Optimizely X: No, but it is possible to achieve the same with page activation.

Classic format:

window["optimizely"].push(["customTag", tagKey, tagValue]);

Optimizely X format:

window["optimizely"].push({
  "type": "page",
  "pageName": "watchedVideo",
});

Custom tags are replaced by Page activation in Optimizely X.

Read more about page activation here.

Delay Pageview Tracking

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["delayPageviewTracking", 1000]);

Optimizely X format:

window["optimizely"].push(["delayPageviewTracking", 1000]);

Continues to work in Optimizely X.

Set Dimension Value

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(['setDimensionValue', dimensionId, 'value']);

Optimizely X format:

window["optimizely"].push({
  "type": "user",
  "attributes": {
    "frequentFlyerStatus": "Gold",
    "frequentFlyerMiles": 25600
  }
});

Continues to work in Optimizely X. Dimensions are called user attributes in Optimizely X. They work the same.

You can read more about sending custom attributes here.

Disable

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["disable"]);

Optimizely X format:

window["optimizely"].push({
  "type": "disable"
});

Continues to work in Optimizely X.

Disable Tracking

Available in Optimizely X:

Classic format: Yes

window["optimizely"].push(["disable", "tracking"]);

Optimizely X format:

window["optimizely"].push({
  "type": "disable",
  "scope": "tracking"
});

Continues to work in Optimizely X.

Log

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["log"]);

Optimizely X format:

window["optimizely"].push({
  "type": "log",
  "level": "INFO"
});

Continues to work in Optimizely X. The different log levels are documented on our knowledge base (link)

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["setCookieExpiration", 365]);

Optimizely X format:

window["optimizely"].push({
  "type": "cookieExpiration",
  "cookieExpirationDays": 365
});

Continues to work in Optimizely X.

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["setCookieDomain", "[www.example.com](http://www.example.com)"]);

Optimizely X format:

window["optimizely"].push({
  "type": "cookieDomain",
  "cookieDomain": "www.example.com"
});

Continues to work in Optimizely X.

Skip Page Tracking

Available in Optimizely X: No

Classic format:

window["optimizely"].push(["skipPageTracking"]);

No longer supported in Optimizely X.

Available in Optimizely X: Unnecessary

Classic format:

window["optimizely"].push(["optOutThirdPartyCookies"]);

As Optimizely X doesn’t use third party cookies, this function is no longer necessary.

Event tracking

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["trackEvent", "watchedVideo"]);

Optimizely X format:

window["optimizely"].push({
  "type": "event",
  "eventName": "watchedVideo",
});

Continues to work in Optimizely X. In Optimizely classic it was possible to track goals that weren't created in the UI yet. In Optimizely X, it is required to create an event prior to using it. Events are the rough equivalent in Optimizely X of Events in Optimizely Classic.

Revenue tracking

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["trackEvent", "watchedVideo", {"revenue": 5000}]);

Optimizely X format:

window["optimizely"].push({
  "type": "event",
  "eventName": "watchedVideo",
  "tags": {
    "revenue": 5000
  }
});

Continues to work in Optimizely X.

Visitor Opt Out

Available in Optimizely X: Yes

Classic format:

window["optimizely"].push(["optOut"]);

Optimizely X format:

window["optimizely"].push({
  "type": "optOut"
});

Continues to work in Optimizely X.

Visitor segments

Available in Optimizely X: No

Classic format:

window["optimizely"].push(['addToSegment', 'apiIdentifier', 'optionalSegmentValue']);
window["optimizely"].push(['removeFromSegment', 'apiIdentifier']);
window["optimizely"].push(['removeFromAllSegments']);

The Segment API was replaced by the Dimension API, and now, in Optimizely X, has been replaced by the Custom Attribute API.

You can read more about sending custom attributes here.