- Optimizely Web Experimentation
- Optimizely Web Personalization
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 timing issues in your experiments.
Order of snippet activation
When the snippet loads on the page where your experiment lives, it 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 the experiments that include that page.
For each experiment that is 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.
After a visitor is bucketed into a variation (which determines what changes are made to the webpage), the snippet executes the code that applies those changes.
After all pages are evaluated and changes from relevant experiments are applied, the rest of the webpage loads.
When a 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; you can monitor these 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 to support the inclusion of visual tags with the event payload.