---
title: Remove A/B test anti-flicker snippets when no tests are running
description: >-
  Disable A/B testing anti-flicker snippets when no tests are running, and close
  completed tests immediately to remove a performance cost that commonly adds 2
  or more seconds to FCP. The anti-flicker snippet is synchronous JavaScript
  that blocks rendering by hiding content until the testing script loads.
source_url:
  html: >-
    https://shopify.dev/docs/storefronts/themes/best-practices/performance/disable-ab-testing-when-inactive
  md: >-
    https://shopify.dev/docs/storefronts/themes/best-practices/performance/disable-ab-testing-when-inactive.md
api_name: liquid
---

# Remove A/B test anti-flicker snippets when no tests are running

Disable A/B testing anti-flicker snippets when no tests are running, and close completed tests immediately to prevent the performance cost. The anti-flicker snippet is typically synchronous JavaScript that blocks rendering by hiding content until the testing script loads.

***

## Why

The anti-flicker snippet creates an artificial delay in the critical rendering path. By design, it blocks rendering to prevent the original page from appearing before the test variant loads, which means users experience a significant delay in seeing any content. This performance cost is often over 2 seconds on [First Contentful Paint (FCP)](https://web.dev/fcp/) and directly hurts [Largest Contentful Paint (LCP)](https://web.dev/lcp/).

**FOOC and FOUC**: FOOC (Flash of Original Content) is when the original page appears briefly before the A/B test script replaces it with the variant. This differs from FOUC (Flash of Unstyled Content), which is when CSS hasn't loaded yet.

The trade-off: performance cost (2 or more seconds of FCP is common) against test accuracy (anti-flicker prevents FOOC) against the business value of insights.

***

## How

### Disable when not testing

Use a [theme setting](https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings) to completely remove the code when no active tests are running:

## config/settings\_schema.json

```json
{
  "name": "Third parties",
  "settings": [
    {
      "type": "checkbox",
      "id": "enable_vwo",
      "label": "Enable VWO Async SmartCode (for A/B testing)",
      "default": false
    }
  ]
}
```

```liquid
{% if settings.enable_vwo %}
  <script>
    // VWO Async SmartCode
  </script>
{% endif %}
```

### Close completed tests

After a test concludes:

* Close the test in the testing platform.
* The platform should disable the anti-flicker automatically.
* Verify that it's disabled.

### Consider server-side testing

Server-side A/B testing has no anti-flicker performance cost. Content arrives pre-rendered with the correct variant.

***

## Examples

Identifying anti-flicker impact in the [Chrome DevTools Network panel](https://developer.chrome.com/docs/devtools/network):

1. HTML and CSS download quickly (lines 1 and 2).
2. Long gap before FCP.
3. Look for testing tool domains, such as `googleoptimize.com` or `visualwebsiteoptimizer.com`.

In this scenario, FCP should occur shortly after CSS loads. A large gap indicates that the anti-flicker snippet is active.

***

## Testing

* Use the [Chrome DevTools Performance panel](https://developer.chrome.com/docs/devtools/performance) to measure the FCP delay. Record a page load and check the timing.
* Temporarily disable the snippet in your theme settings to measure the performance improvement.
* Compare performance with A/B tests enabled against performance with them disabled.
* Verify the cost to real users by checking your RUM data. See the [Lab vs. field data](https://shopify.dev/docs/storefronts/themes/best-practices/performance/lab-vs-field) guide for more on RUM.

***

## References

* [`if`](https://shopify.dev/docs/api/liquid/tags/if) tag
* [`settings`](https://shopify.dev/docs/api/liquid/objects/settings) object
* [Theme settings schema](https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings)
* [Debugging common causes for slow loading in Shopify Liquid storefronts](https://performance.shopify.com/blogs/blog/debugging-common-causes-for-slow-loading-in-shopify-liquid-storefronts)
* [Defer non-critical scripts](https://shopify.dev/docs/storefronts/themes/best-practices/performance/defer-scripts)
* [Reserve space for app-injected content](https://shopify.dev/docs/storefronts/themes/best-practices/performance/reserve-space-app-injected)
* [Debugging with metric gaps](https://shopify.dev/docs/storefronts/themes/best-practices/performance/performance-gaps)

***