πŸ“œ JS deferral

Keep non-essential scripts (chat widgets, popups, third-party apps) on hold until customers actually interact with your page β€” so your content shows up first.

Who can use this feature?

JS deferral is available on the Expert plan.

What is JS deferral?

Every app you install adds JavaScript to your store. A chat widget, a popup builder, a review tool β€” each one runs on every page, even before customers see anything. That pile of scripts slows down your initial load.

JS deferral holds those scripts back. Your page content loads first. The scripts only kick in when the customer scrolls, clicks, or taps β€” by which point they're already engaged with your store.

For more control, you can use the Script manager to decide exactly which scripts get deferred.

Why use JS deferral?

  • Faster initial load β€” your content appears before non-essential scripts run.

  • Tames app bloat β€” keeps chat widgets, popups, and review tools from slowing down every page.

  • Better Core Web Vitals β€” less JavaScript blocking the first render.

  • Granular control β€” use Script manager to choose exactly which scripts defer and which load immediately.

  • No lost functionality β€” deferred scripts still run as soon as the customer interacts.

βš™οΈ How to use JS deferral

Step 1: Open Self-optimize

Go to Speed up β†’ Self-optimize.

[Screenshot: Speed up page with Self-optimize tab open]

Step 2: Turn on JS deferral

Turn on JS deferral.

[Screenshot: JS deferral toggle switched on]

Step 3: Apply to your theme

Click Speed up now and pick a theme to apply changes.

[Screenshot: Speed up now button and theme selection modal]

Want more control? Use Script manager

  1. Open Script manager inside the JS deferral settings.

    [Screenshot: Script manager panel with detected scripts list]

  2. Click Check for new scripts to scan your store. You'll see every script with its name, source, size, and where it's used.

    [Screenshot: Check for new scripts button + scripts table]

  3. For each script, pick how it should load:

    • Immediate β€” loads with the page (use for scripts your page needs right away).

    • On user action β€” waits until the customer clicks, scrolls, or taps.

    [Screenshot: load trigger dropdown with Immediate and On user action options]

  4. Save your changes.

πŸ“Œ Merchant Notes

  • JS deferral works on scripts added through Shopify's Script Tag API. Apps that inject scripts other ways may not appear in Script manager.

  • Always click Speed up now after turning this on to apply the changes.

  • Keep scripts your page needs right away set to Immediate β€” only defer non-essential ones to avoid breaking functionality.

  • This feature requires the Expert plan.

  • For an overview of all optimization features, see Speed up.

Contact us in live chat if you have any problems.

Last updated