- Better understand how Optimizely Web Experimentation executes on a page from a technical point of view, including targeting, traffic allocation, variation code, and event firing
- Understand how Optimizely Web Experimentation evaluates variation code for an experiment
- Diagnose timing issues with experiments
This article explains the snippet's order of operations. Knowing this can help you design more effective experiments that do not detract from your site's user experience. It is also a good place to troubleshoot any timing issues in your experiments.
Snippet order of activation
When the snippet loads on the page where your experiment lives, it immediately applies API calls in the
When the page's activation trigger fires and targeting conditions are passed, the page activates. Any page, regardless of activation mode, may also be triggered by name at any time by the page API call.
When a page activates, Optimizely Web Experimentation evaluates all the experiments that include that page.
For each experiment that's included, Optimizely Web Experimentation evaluates whether a visitor is eligible to enter the experiment. Visitor eligibility is evaluated based on the experiment's traffic allocation and audience conditions.
If both audience and traffic conditions are passed, the experiment activates.
Each visitor who is allocated to an experiment is assigned to a variation (which may be the control, or "original," variation). Based on the number of variations and the bucketing probabilities described by the experiment's traffic distribution, the visitor is bucketed into a specific variation. A decision event is logged at this stage.
Once a visitor is bucketed into a variation (which determines what changes will be made to the webpage), the snippet executes the code that applies those changes.
Once all pages are evaluated and changes from relevant experiments are applied, the rest of the webpage loads.
Now, when the visitor interacts with the webpage, they may trigger a conversion event that is tracked by Optimizely Web Experimentation. Optimizely Web Experimentation records the event and associates it with the variation.
How Optimizely Web Experimentation executes code
At the variation level, changes from the Visual Editor can be configured to either run in sequence (where making one change depends on a prior change) or in parallel (where all changes execute as soon as the selector is ready). In contrast, variation custom code executes immediately, exactly as written. All timing considerations must be written into the code itself.
Custom variation CSS is added as a style tag to the bottom of the head.
How events are fired
Optimizely Web Experimentation tracks events that you configure, such as click and custom events. The snippet also natively emits certain events, such as when a visitor is bucketed; these can be monitored via Optimizely's event listeners. All events are emitted immediately when the triggering event occurs.
However, event tracking for Optimizely's Experimentation Results service can occasionally be delayed for data analysis and performance purposes. For example, the activation of a page may not be emitted until DOMContentLoaded in order to support the inclusion of visual tags with the event payload.