PerformanceMay 14, 20269 min read

Chat Widgets and Core Web Vitals: How Intercom, Tidio, Gorgias, and Freshchat Affect Store Performance

Live chat drives 3-5x higher conversion rates for assisted sessions — but each chat widget injects JavaScript that can cost 200-800ms of additional page load time. The 7-point audit for chat that converts without tanking Core Web Vitals.

StoreVitals Team

Live chat has one of the best ROI profiles in ecommerce tooling: sessions with chat assistance convert at 3-5x the rate of unassisted sessions, and proactive chat triggers on high-intent pages (cart, checkout) routinely deliver 10-15% conversion lift. The market is crowded — Gorgias for Shopify-heavy stores, Tidio for SMB price-point, Intercom for mid-market, Freshchat for enterprise, Re:amaze for multi-channel — and most stores have at least one installed.

The performance cost is what StoreVitals scans consistently flag: chat widgets are among the heaviest third-party scripts in the ecommerce ecosystem. Intercom's messenger script is 300-500KB. Gorgias loads 180-280KB of JavaScript before the chat frame is displayed. Tidio sits in the 150-250KB range. These are not render-blocking in the traditional sense, but they compete for main thread time and delay LCP on mobile connections. Below is the 7-point audit for chat widgets that deliver the conversion value without paying the full performance tax.

1. Understand the Chat Widget Loading Chain

Most chat widgets follow the same loading pattern:

  1. A small launcher script loads synchronously or via defer/async
  2. The launcher detects the user's browser and geography, then decides whether to load the full chat SDK
  3. The full SDK loads — this is the 150-500KB chunk
  4. The SDK initializes and renders the chat bubble in the corner

The problem: steps 3 and 4 happen even if the customer never clicks the chat bubble. On a 4G mobile connection (10-15 Mbps typical), a 300KB chat script costs 200-300ms of network transfer plus 50-100ms of parse and execution time. That competes directly with LCP — the largest visible element (usually the hero image or product photo) — which Google uses as the primary user experience signal for ranking.

The optimization: make steps 3 and 4 lazy. Don't load the full SDK until a user interaction signals intent to use chat.

2. Lazy Load vs Defer vs Async

Three loading strategies for chat scripts, ranked from worst to best for Core Web Vitals:

  • Synchronous (worst): Blocks HTML parsing. Never use this for third-party chat scripts. Adds 500ms+ to LCP on slow connections.
  • async (better): Loads in parallel with HTML parsing, executes immediately when downloaded. Still competes with LCP rendering if the script is large.
  • defer (better for order-sensitive): Loads in parallel, executes after HTML parsing. Better than async for scripts that depend on DOM elements.
  • Interaction-triggered lazy load (best): Don't load the SDK at all until the first user interaction (mousemove, touchstart, scroll). Eliminates the chat widget cost entirely for bounce-and-gone sessions.

The interaction-triggered approach typically saves 200-500ms of LCP on mobile. The tradeoff: proactive chat triggers (the "Anything I can help you find?" popup that fires after 30 seconds) require the SDK to be loaded before trigger time. For stores where proactive triggers are converting, use setTimeout-based loading (load after 5-7 seconds) instead of true lazy load.

3. INP and Chat Widget Event Handlers

Interaction to Next Paint (INP) is the newest Core Web Vitals metric — it measures the time from user interaction (tap, click) to the browser painting a visual response. Chat widgets are a common source of INP regressions because:

  • SDK initialization fires on the first user interaction — if the widget loads async and a customer clicks Add-to-Cart before the SDK finishes initializing, the initialization blocks the main thread and delays the cart update response
  • Event listener bloat — heavy chat SDKs register dozens of event listeners for tracking session activity, which adds overhead to every user interaction regardless of whether it's chat-related
  • Polling for agent availability — some chat widgets poll the server every few seconds to check agent availability status, generating background main-thread work

The validation: open Chrome DevTools → Performance tab, record a page interaction while the chat SDK is loading, look for Long Tasks (tasks over 50ms). Chat SDK initialization tasks are often 100-300ms long tasks that suppress INP responses.

4. Chat on the Checkout Page

Most chat platforms allow granular URL-based show/hide rules. The checkout page deserves special attention:

  • Shopify's checkout is strictly controlled — third-party scripts require Shopify Plus for full checkout customization; non-Plus stores often can't load chat widgets on checkout pages at all
  • Chat bubbles compete with checkout CTAs on mobile — the floating chat bubble can overlap the "Complete order" button on small screens, directly suppressing checkout conversion
  • Checkout performance is highest-stakes — a 100ms delay on the checkout page has measurably higher conversion cost than the same delay on a product page; don't load non-essential scripts here

Recommendation: disable chat widgets on /checkout and /thank-you pages by default. Re-enable only if you have direct evidence that post-checkout chat interactions drive LTV (upsell, refund prevention).

5. Chat Widget CLS Patterns

The floating chat bubble in the bottom corner causes CLS when it appears via JavaScript after initial page paint. Two patterns that fail CLS:

  • Bubble loads visually after LCP — the page is already painted and the bubble slides in, shifting content above it (especially on mobile where the bubble overlaps content near the fold)
  • Bubble repositions based on other widgets — if you have both a chat widget and a cookie consent banner, their positioning logic can conflict, causing the bubble to jump positions

The fix: most modern chat platforms support a "launcher display" configuration that sets position, offset, and delay. Set the offset to avoid overlapping other fixed-position elements, and use the SDK's built-in delay/fade-in instead of CSS animations that trigger layout.

6. Gorgias vs Intercom vs Tidio — Performance Profile Comparison

From StoreVitals scan data across Shopify stores:

  • Gorgias: 180-280KB SDK, loads synchronously by default in most Shopify theme integrations. Gorgias-specific note: the SDK loads even when no agents are online, which is a common misconfiguration — use the "business hours" setting to suppress loading during off-hours
  • Intercom: 300-500KB SDK, has a built-in lazy boot option (Intercom("update") instead of Intercom("boot") defers initialization). The Intercom launcher article is the canonical reference for this optimization
  • Tidio: 150-250KB SDK, offers a "lazy widget" mode in their settings panel. Most SMB stores have this disabled by default
  • Freshchat: 200-350KB, uses a Web Widget variant that's generally lighter than the full Freshdesk Suite implementation
  • Re:amaze: 120-200KB, lighter than most competitors, but still benefits from defer loading

7. The Chat Widget Audit Checklist

Use this checklist when evaluating your chat widget's performance impact:

  1. Open a Chrome incognito window on a throttled 4G connection (DevTools → Network → Fast 4G)
  2. Run Lighthouse mobile audit — note the LCP value and identify whether the chat script appears in the "Reduce impact of third-party code" diagnostic
  3. Check the Network tab waterfall: does the chat SDK start loading before LCP is painted? It shouldn't.
  4. Open DevTools → Performance → record a page load — identify Long Tasks attributed to the chat SDK initialization
  5. Verify chat is suppressed on the checkout page (or explicitly allowed with documented ROI rationale)
  6. Check for positioning conflicts with cookie banners or other fixed-position elements on mobile
  7. Enable the SDK's native lazy boot or interaction-triggered loading option if available

Live chat is worth the performance cost when implemented correctly. The implementation floor — interaction-triggered loading, suppressed on checkout, no positioning conflicts — recovers most of the Lighthouse score while keeping the conversion value intact. The JavaScript Performance Checker identifies heavy third-party scripts including chat widgets in your store's loading profile.

live chatIntercomTidioGorgiasCore Web VitalsLCPINPperformance

See these issues on your store?

Run a free scan and find out in seconds.

Run Free Scan