Preventing flicker in A/B tests
When visitors briefly see the old version, it distorts more than the impression, it distorts the result. The causes, and what helps.
What this article covers
Flicker, or FOOC, flash of original content, is the brief moment in which the original page is visible before the variation kicks in. It looks unprofessional and it costs you validity.
Why flicker distorts the result
Visitors in the variation see two states, visitors in the original only one. The groups then differ not only in the change under test but also in the loading experience. That is exactly what the test was supposed to rule out.
The three most common causes
- The script loads too late, at the end of the page instead of in the head, or behind a tag manager that has to load first.
- The configuration arrives over a slow connection because it is requested from a foreign domain.
- The variation only changes after a rendering pass because it waits for an element that another script inserts later.
What helps
- Snippet in the head, not at the end of the page, and not nested inside a tag manager.
- Delivery through your own domain: less connection setup, blocked less often.
- Switch on the anti-flicker option: the affected area stays briefly invisible and is shown again after a fixed maximum time regardless.
- Build variations on CSS rather than JavaScript where possible. CSS applies before the first render.
- Target stable anchors instead of elements another script inserts later.
Check instead of hope
Test the variation once with a throttled connection in your developer tools. What is invisible on fast internet takes noticeably longer on a mobile connection, and that is where most purchases happen.