Why Do I Notice a Page Flicker When the Test Page Is Loading?

Last updated

You may, at times, notice a page flicker. (See control for a split second before the variation loads). The following are some possible reasons for the page flicker:

  • The VWO smart code was added via a tag manager: When using a tag manager to load the VWO code, ensure that the tag manager is set to Synchronous code. When the tag manager is set to Asynchronous code, your visitors might see a flicker in the variations loaded. This means that when visitors are supposed to see a variation, they will see the control page for a moment before the changes appear, as the code is loaded by the tag manager. As a best practice, you should manually add the VWO smart code directly on your campaign pages. Reach out to VWO support for any assistance.
    For example, VWO supports integration with the Tealium tag manager flawlessly when Tealium settings are configured with Synchronous code.
  • JS code changes causing the page to flicker: If visitors use only the operations supported by visual editor, they know the exact elements modified and hide them until a variation change is loaded. But if you add a JavaScript code snippet to change some elements on the web page, you might notice a flicker—original content will flash before the change is applied—on the live site. To minimize the flicker, run the script as soon as its target element is ready on the page, as shown in the following code snippet.
    // Avoid multiple setIntervals gettings started.
    if (window.vwoElInterval) {
    clearInterval(window.vwoElInterval);
    }
    window.vwoElInterval = setInterval(function() {
    if (vwo_$(CSS_SELECTOR_PATH_OF_ELEMENT).length) {
    // Make changes that require the element to be present
    clearInterval(window.vwoElInterval);
    }
    });

    Reach out to VWO support for any assistance.

  • The VWO smart code is added to the bottom of the webpage and not in the header: If the VWO smart code is added at the end of the web page, the browser executes the VWO code only in the end. In the meantime, you may notice a flash of the original (or control) page before you see the variation page. Ensure that the VWO code snippet is added to the header of the web page.
  • Change image operation: If you add large-sized images to the variation, the images may take some time to download on the page. Until the images are downloaded, old images/content continue to be displayed. This might appear like a page flicker to the visitors. Here is a workaround for this problem.

Was this article helpful?

Thanks for your feedback!
Please email us at support@vwo.com to tell us what you were looking for. We'll send the answer to your inbox.

Contact Us / Login

Product
Resources Home