.svg){kind=logo}
What is Flicker
Flicker occurs when a webpage loads in one state (often a base page) and then transitions to show a variation of that page, often a dynamic variation of the page for improved personalization or experimentation.
Why is Flicker Bad
The issue here is that website visitors i.e. potential customers can witness a variation of your website that wasn’t meant for them to see. That blip can shake a visitor's confidence in your brand and also generate a sense of mistrust, thereby ruining a customer’s first impression of your brand irreparably. This millisecond mistake can cause visitors to question the legitimacy of your brand and site. What offer are others receiving? Is it better than what I am being offered? What assumptions are being made about me as a shopper and how accurate or inaccurate are those assumptions?
What Causes Flicker?
Typically, common sources of flicker are A/B testing or website optimization solutions. Almost all of these tools are implemented on your website through a javascript snippet that manipulates the HTML and/or CSS. When the base webpage is able to render ahead of these solutions making the desired changes, your visitors can potentially get served a page that wasn’t meant for their segment.
The most common reasons for experiencing flicker tend to be related to how the JavaScript snippet is implemented. Page manipulating snippets being served using a tag manager, running page manipulating snippets asynchronously and optimization snippets leveraging external data are just a few of the culprits responsible for instances of flicker. For a full breakdown of causes, this in-depth post shares all of the details.
How to Avoid Flicker
Most web optimization solutions offer some degree of an “anti-flicker snippet” or anti-flicker method to handle more tricky edge cases. Most solutions can temporarily hide your website until after your optimization solution has had the opportunity to run. While many anti-flicker strategies can impact page speed metrics, they remove any chance of flicker as the optimization solution is able to manipulate the page while it’s hidden.
Recommended Content:
