How to fix cwv inp on Klaviyo

Steps for Klaviyo

1. Load the Klaviyo snippet asynchronously and deferred: in your Shopify theme's `theme.liquid` (or equivalent base layout), locate the Klaviyo `<script>` tag (company ID embed) and ensure it uses both `async` and is placed just before `</body>` rather than in `<head>`. If you installed Klaviyo via the Shopify Sales Channel app, go to Klaviyo → Settings → Integration → Shopify and toggle on 'Load Klaviyo.js asynchronously' if available, then re-save.
2. Delay Klaviyo's onsite popup/flyout evaluation until after the page is interactive: in Klaviyo → Signup Forms, open each active form → Settings tab → 'Display Timing'. Set a display delay of at least 3–5 seconds (or trigger on scroll/exit intent) so the form's JS does not execute during the critical post-load interaction window.
3. Audit and throttle Klaviyo event listeners in your theme: search your JS files for `klaviyo.push`, `_learnq.push`, and `identify`/`track` calls. Move any that fire on every `scroll` or `mousemove` event into debounced/throttled wrappers (e.g., debounce 200–300 ms) so they do not block the main thread during user interactions.
4. Defer the Klaviyo back-in-stock and product-view tracking scripts: wrap any inline `_learnq.push(['track', ...])` calls in a `requestIdleCallback` (with a `setTimeout` fallback for Safari) so they yield to user input before executing — e.g., `requestIdleCallback(() => { _learnq.push(['track', 'Viewed Product', {...}]); });`
5. Remove or consolidate redundant Klaviyo script tags: check that Klaviyo's `klaviyo.js` snippet is only loaded once across your theme (theme.liquid, app embeds, and any third-party integrations). Multiple loads cause duplicate event handler registration that compounds INP cost — use your browser's Network panel to confirm a single request to `static.klaviyo.com/onsite/js/klaviyo.js`.
6. Test INP impact after each change using Chrome DevTools → Performance panel: record a trace while clicking an Add-to-Cart button or newsletter form submit, inspect 'Long Tasks' (red bars > 50 ms) attributed to `klaviyo.js`, and confirm total interaction duration drops below 200 ms before deploying to production.

What is cwv inp?

Interaction to Next Paint (INP) measures how quickly your page visually responds after a visitor taps a button, opens a menu, or types in a search box — from the moment they interact to the moment the screen actually updates. Google considers anything under 200 ms "good," 200–500 ms "needs improvement," and over 500 ms "poor." INP is now a Core Web Vital, meaning it is part of Google's official page-experience signal that feeds directly into rankings. A high INP score almost always means the browser's main thread is busy running JavaScript and simply cannot get around to updating what the visitor sees for a frustrating fraction of a second (or longer).

Google uses Core Web Vitals — including INP — as a ranking signal, so a poor INP score can quietly suppress your pages in search results compared to faster competitors. Beyond rankings, a sluggish-feeling page directly hurts conversions: studies consistently show that every 100 ms of added interaction delay reduces add-to-cart and checkout completion rates. On mobile, where CPU speed is limited and networks are slower, a 500–800 ms INP is especially damaging because mobile shoppers are the majority of ecommerce traffic. There is also an accessibility dimension — users who rely on keyboard navigation or assistive technology are disproportionately harmed by delayed visual feedback, which can create a frustrating or unusable experience.

See the complete Cwv inp guide for every platform and the full background.