How to fix low performance score on Shopify

Steps for Shopify

1. Theme bloat — Online Store → Themes → Customize: disable or remove unused sections, apps, and feature blocks. Each app you remove from the theme eliminates its JS/CSS payload.
2. App scripts — Apps → (review each installed app) → uninstall any apps whose scripts load on every page but are not actively used; residual script tags from deleted apps must be removed manually in Online Store → Themes → Edit Code → theme.liquid (look for <script> tags referencing old apps).
3. Image optimization — Shopify automatically serves WebP via its CDN when the browser supports it; ensure your theme uses the img_url filter with width parameter, e.g. {{ product.featured_image | img_url: '800x' }}, so Shopify resizes and CDN-delivers the correct size. Add explicit width and height attributes in the img tag.
4. Lazy-loading — In Edit Code → snippets/product-image.liquid (or equivalent), add loading='lazy' to all below-the-fold images; the hero/above-fold image should have loading='eager' and fetchpriority='high'.
5. Font optimization — In theme.liquid, replace Google Fonts <link> imports with a self-hosted subset or use font-display: swap in your CSS (Online Store → Themes → Edit Code → assets/theme.css).
6. Use a performance-focused theme — Dawn (Shopify's free default) scores significantly higher than many third-party themes. Consider migrating if your current theme is the root cause.
7. Apps to help — 'Crush.pics' or 'TinyIMG' for bulk image compression; 'Tapita' or 'Hyperspeed' for script deferral and CSS optimization specific to Shopify.

<!-- Hero/LCP image: load eagerly with high priority, explicit dimensions -->
<img
  src="hero-banner.webp"
  alt="Summer collection — shop now"
  width="1200"
  height="600"
  loading="eager"
  fetchpriority="high"
/>

<!-- All below-fold images: lazy-load, explicit dimensions to prevent CLS -->
<img
  src="product-thumbnail.webp"
  alt="Blue running shoes"
  width="400"
  height="400"
  loading="lazy"
/>

<!-- Defer non-critical third-party scripts -->
<script src="https://example-chat-widget.com/widget.js" defer></script>

What is low performance score?

Lighthouse (the engine behind Google's PageSpeed Insights tool) grades every page from 0–100 on performance. The score rolls up several real-world loading metrics — most importantly Google's Core Web Vitals: Largest Contentful Paint (LCP, how fast the main content appears), Interaction to Next Paint (INP, how fast the page reacts to taps/clicks), and Cumulative Layout Shift (CLS, how much the layout jumps around). A score of 8/100 on mobile means the page is extremely slow for the majority of shoppers who visit on a phone. The score is not a vanity number — it reflects a genuine, measurable delay that real visitors experience.

Google uses page experience signals, including Core Web Vitals, as a ranking factor for mobile search — a store with a very low score can lose meaningful search visibility to faster competitors. Beyond rankings, conversion research consistently shows that every additional second of load time can reduce conversions by 10–20%; a score in single digits means customers are likely abandoning the page before it even finishes loading. Slow pages also penalize your Google Ads Quality Score, raising your cost-per-click. On mobile — where most ecommerce traffic now originates — the experience gap between a score of 8 and 80 is the difference between a bounce and a sale.

See the complete Low performance score guide for every platform and the full background.