This is the master reference checklist for Shopify speed optimization, organized into ten categories covering every layer of performance from launch to long-term maintenance. Work through each section in order. Each item is actionable, binary, and ties directly to a measurable performance outcome. Use this before launching a new store, after inheriting a slow store, and quarterly to catch regressions before they affect rankings and conversions.
How to Use This Checklist
Highest score impact. Fix these before anything else.
Requires theme code access to implement.
Completable in under 30 minutes with no code.
Run through the checklist on three pages minimum: your homepage, your best-selling product page, and your highest-traffic collection page. Before starting, document your baseline scores:
| Page | Mobile Score | LCP | CLS | INP | Page Weight |
|---|---|---|---|---|---|
| Homepage | |||||
| Product Page | |||||
| Collection Page |
Section 1: Pre-Launch Checklist
For stores about to go live, these items prevent performance problems from reaching real visitors. For existing stores, treat this as a store health baseline check.
Theme Selection and Setup
- Quick Win Theme was chosen with PageSpeed score above 60 on a clean install (check Shopify Theme Store score before purchasing)
- Quick Win Unused theme features are disabled in theme settings, not just hidden
- Developer Theme does not load jQuery if not required by your custom code
-
Developer Theme uses Shopify's native
image_urlfilter with width and format parameters for all images - Quick Win Theme fonts are limited to 2 families and 2 weights maximum
-
Developer Theme JavaScript uses
deferattribute on all non-critical script tags
Store Configuration
- Quick Win Google Analytics 4 is configured through Google Tag Manager, not as a direct theme.liquid snippet
- Quick Win No duplicate tracking implementations (check for GA4 loaded both directly and via GTM)
- Quick Win Cart type is set to a drawer or AJAX cart (avoids full page reload on add to cart)
- Quick Win Checkout uses Shopify's native checkout without heavy customization scripts
App Stack
- Quick Win Total installed apps are 10 or fewer for a new store launch
- Quick Win Every installed app has a clear, measurable business purpose defined before install
- Quick Win No apps installed "to try out" without a committed evaluation period and removal plan
Section 2: Image Optimization Checklist
Images are the highest-impact optimization category. Every item here directly reduces page weight, which is the most direct input to load time.
Critical Format and Compression
- Quick Win All hero and banner images are in WebP format
- Quick Win All product images are in WebP format
- Quick Win No GIF files exist anywhere in the store - all animated content converted to MP4 video
- Quick Win No PNG files used for photographic content (PNG only for graphics with true transparency)
- Quick Win Hero images are under 150KB
- Quick Win Product images are under 100KB each
- Quick Win Collection grid thumbnail images are under 60KB each
Critical Sizing and Responsive Delivery
-
Developer All
<img>tags in theme use Shopify'simage_urlfilter with awidthparameter -
Developer Hero image uses
srcsetwith at least 3 width variants (600w, 900w, 1400w) -
Developer Product images use
srcsetwith variants matching display widths at different breakpoints -
Developer All
<img>tags have explicitwidthandheightattributes matching the image's intrinsic aspect ratio - Quick Win No image is uploaded above 2000px on its longest side
-
Developer Collection grid images use
sizesattribute reflecting the actual CSS grid column width at each breakpoint
Critical Loading Priority
-
Developer LCP image (hero or main product image) has
loading="eager"andfetchpriority="high" -
Developer LCP image is never using
loading="lazy"- verify this after every theme update -
Developer First row of collection grid images (4 to 8 images) use
loading="eager" -
Developer All images below the first viewport use
loading="lazy" -
Developer Gallery images on product pages use
loading="lazy"for all except the first image
Advanced Image Optimization
-
Developer LCP image has a
<link rel="preload">hint in<head>with matchingimagesrcsetandimagesizesattributes - Quick Win Background images used purely for decoration are suppressed on mobile via CSS media query
- Quick Win Video content on homepage uses MP4, not GIF, with a static poster image placeholder
Section 3: Theme Optimization Checklist
The theme is the performance foundation. Problems here affect every page and every visitor simultaneously.
Critical Theme Code Quality
- Developer Theme does not load jQuery (or if it does, confirm jQuery is actually required and no native alternative exists)
- Developer Theme does not load unused JavaScript libraries (Flickity, Swiper, AOS) for features not enabled
- Developer Unused CSS purged from theme's main stylesheet - Coverage tab shows less than 60% unused rules
-
Developer CSS animations only use
transformandopacityproperties (nottop,left,width,height) - Developer No CSS animations using JavaScript scroll events - Intersection Observer used instead
-
Developer
@media (prefers-reduced-motion: reduce)respected in all animation declarations
Section and Template Structure
- Quick Win Unused sections are removed from all page templates (not just hidden)
-
Developer Section-specific CSS and JavaScript are loaded via section schema
stylesheetandjavascriptkeys - Developer DOM node count on primary pages is under 1,500 (check with Chrome DevTools Elements panel)
- Developer Modals and overlays are rendered via JavaScript on trigger, not pre-rendered in DOM on page load
JavaScript Loading
-
Developer All non-critical
<script>tags intheme.liquidusedeferattribute -
Developer No synchronous scripts blocking rendering in
<head> -
Developer Theme uses
type="module"for ES module scripts where applicable -
Developer Scroll and touch event listeners use
{ passive: true }option throughout theme JavaScript
Font Optimization
- Quick Win Maximum 2 font families loaded across the entire store
- Quick Win Maximum 2 weights per font family (typically 400 Regular and 600 or 700)
- Quick Win No italic font variants loaded unless explicitly used in design
-
Developer
font-display: swapadded to all@font-facedeclarations -
Developer Above-fold fonts preloaded with
<link rel="preload" as="font" crossorigin> - Quick Win Icon fonts (Font Awesome, Material Icons) replaced with inline SVG or SVG sprite
- Quick Win Google Fonts URL includes only the specific weights used (not all available weights)
Section 4: App Audit Checklist
Apps are the most common source of performance regression over time. Audit the app stack regularly, not just once.
Critical App Inventory
- Quick Win Complete list of all installed apps exists with: script size, pages loaded, monthly cost, last actively used date
- Quick Win Every app has a named business owner responsible for its continued presence
- Quick Win No apps installed for a past campaign that is no longer running
- Quick Win No duplicate-function apps (two review apps, two email capture tools, two loyalty programs)
Critical Script Impact Assessment
- Quick Win Chrome DevTools Network tab shows no more than 5 external script domains on the homepage
- Quick Win Total third-party JavaScript loading on the homepage is under 400KB
- Developer Chrome DevTools Coverage tab shows no app script file with less than 20% usage on pages where it loads
- Quick Win PageSpeed Insights "Reduce the impact of third-party code" lists no domain with more than 300ms blocking time
Critical Script Restriction
-
Developer Review app scripts load only on
producttemplate pages -
Developer Upsell and cross-sell app scripts load only on
productandcarttemplate pages -
Developer Size guide and fit finder scripts load only on
producttemplate pages -
Developer Instagram feed scripts load only on
index(homepage) template -
Developer Email popup scripts load only on
indextemplate - Developer No app script loads globally without a clear business justification for global loading
Deferred Loading
- Developer Chat widget loads after first scroll, mousemove, or touchstart interaction (not on page load)
- Developer Heatmap and session recording tools load with a 3 to 4 second delay or after interaction
- Developer Loyalty program display defers initialization until section scrolls into viewport
App Removal Verification
- Developer After uninstalling any app, theme code searched for orphan script tags referencing that app's domain
- Quick Win Chrome DevTools Console shows no 404 errors from scripts loading from uninstalled app domains
- Developer GTM workspace contains no inactive tags from removed apps
Section 5: Code Optimization Checklist
This section covers JavaScript, CSS, and Liquid code quality - the layer that directly determines TBT, TTFB, and INP.
Critical JavaScript
- Developer No JavaScript polyfills loading for browsers your audience does not use
- Developer No JavaScript libraries included whose functionality is available natively in modern browsers
- Developer All custom JavaScript split into page-specific modules loaded conditionally
- Developer Cart functionality uses Shopify's native Cart API directly without third-party wrapper
- Developer Variant switching data pre-rendered into a JavaScript object at Liquid render time
-
Developer
requestIdleCallbackused for non-critical JavaScript initialization - Developer Long tasks (50ms+) absent from Chrome DevTools Performance recording of page load and key interactions
CSS
-
Developer Critical above-fold CSS inlined in
<style>tag in<head>(8 to 15KB) -
Developer Full stylesheet loads asynchronously via preload-then-swap pattern with
<noscript>fallback - Developer Custom CSS in theme customizer's CSS field is minified before pasting
- Developer No more than 4 distinct breakpoints in theme CSS
- Quick Win Print media queries removed if print-friendly layouts are not required
Critical Liquid Code
- Developer Shopify Theme Inspector shows no template or snippet rendering above 100ms
- Developer No nested loops in collection templates
-
Developer All collection loops wrapped in
{% paginate %}with 16 to 24 products per page - Developer Metafield lookups inside loops assigned to variables at the start of each iteration
-
Developer Navigation menu uses Shopify's
linklistobject, not a loop over all collections -
Developer
{% where %}and{% map %}Liquid filters used instead of loop-based filtering -
Developer
limit:parameter used on all loops that need only a subset of items - Developer Same collection or product object not fetched multiple times on the same page template
Section 6: Mobile Optimization Checklist
Mobile optimization is a separate discipline from desktop optimization. Every item here targets the specific constraints of mobile devices and connections.
Mobile-Specific Images
-
Developer Hero image
srcsetincludes a 390px or 480px variant for small phone screens -
Developer
sizesattribute on hero image reflects actual mobile display width - Developer Portrait-format hero image available and configured for mobile viewports
- Developer Decorative background images suppressed on mobile via CSS media query
- Quick Win No auto-play video served to mobile visitors - static poster image used instead
Mobile JavaScript
- Developer Desktop-only features (image zoom, hover overlays, parallax) not initialized on mobile
- Developer Mobile gallery uses CSS scroll snap instead of JavaScript carousel library
- Developer JavaScript execution time under 2 seconds under 4x CPU throttle in Chrome DevTools
- Developer No parallax scroll effects on mobile viewport
-
Developer Sticky add-to-cart bar uses
transform: translateYfor show/hide
Touch and Interaction
-
Quick Win Viewport meta tag set to
width=device-width, initial-scale=1in<head> - Developer All interactive elements have minimum 48x48 CSS pixel tap target size
-
Developer All scroll and touch event listeners use
{ passive: true }option
Mobile Testing
- Quick Win Store tested on a real mid-range Android device on actual 4G connection
- Quick Win Store tested on a real iPhone in Safari
- Quick Win Cold-cache load time on real device is under 4 seconds for the homepage
- Quick Win Add to cart interaction on real mobile device responds in under 200ms
Section 7: Core Web Vitals Checklist
Core Web Vitals are the three metrics that directly affect Google rankings. Each has specific causes and specific fixes.
Critical LCP (Largest Contentful Paint - target: under 2.5 seconds)
- Quick Win LCP element identified from PageSpeed Insights diagnostic
-
Developer LCP element has
fetchpriority="high"attribute -
Developer LCP element has
loading="eager"attribute - neverloading="lazy" -
Developer LCP image preloaded with
<link rel="preload">in<head>withimagesrcsetandimagesizes -
Developer Preconnect hint for Shopify CDN (
cdn.shopify.com) in<head>withcrossorigin - Developer TTFB under 400ms (verified with WebPageTest.org waterfall)
- Developer No render-blocking resources delaying LCP image download start
- Quick Win LCP image is WebP format and under 150KB
Critical CLS (Cumulative Layout Shift - target: under 0.1)
-
Developer All
<img>tags in theme have explicitwidthandheightattributes -
Developer Shopify image objects use
.widthand.heightproperties for dimension values -
Developer
font-display: swapon all@font-facedeclarations - Developer Announcement bar rendered server-side in Liquid with a fixed height
-
Developer Cookie consent banner uses
position: fixed(not document flow) -
Developer App widget containers have
min-heightreserved before widget initializes - Developer Video and iframe embeds wrapped in aspect-ratio containers
- Developer No content injected above existing page content after initial render
Critical INP (Interaction to Next Paint - target: under 200ms)
- Developer No long tasks (50ms+) in Performance panel recording of add-to-cart interaction
- Developer No long tasks in Performance panel recording of variant switch interaction
- Developer Add-to-cart JavaScript separates cart response (immediate) from recommendation loading (async)
- Developer Cart drawer opens before recommendation API call fires
- Developer All scroll and touch event listeners passive
- Quick Win PageSpeed Insights mobile INP shows Good (under 200ms)
-
Developer Non-critical initialization uses
requestIdleCallback
Section 8: Testing Checklist
Testing discipline is what separates optimization work that delivers lasting results from work that regresses within weeks.
Baseline and Measurement
- Quick Win Three PageSpeed tests run per page type before any changes (not one test)
- Quick Win Tests run on mobile specifically, not just desktop
- Quick Win Test URLs use production store URLs (not theme preview URLs)
- Quick Win Results logged in a spreadsheet with date, page, score, and all Core Web Vitals values
Tooling
- Quick Win WebPageTest.org filmstrip view used to verify load sequence visually
- Quick Win GTmetrix waterfall used to identify specific late-loading resources
- Developer Chrome DevTools Coverage tab run on each primary page
- Developer Chrome DevTools Performance tab recording reviewed for long tasks
- Quick Win Shopify Theme Inspector confirms Liquid render times under 50ms per snippet
- Quick Win Chrome DevTools Console shows zero 404 errors from orphan app scripts
Change Validation
- Quick Win Single change made and tested before next change (no batching multiple changes)
- Quick Win 15 to 30 minutes waited after change for Shopify CDN cache to clear before retesting
- Quick Win Before and after scores documented for every change alongside description of what changed
- Quick Win Tests run in incognito mode (no browser extension interference)
Field Data Validation
- Quick Win Google Search Console Core Web Vitals report checked 28 days after optimization
- Quick Win Shopify admin speed score checked 30 days after optimization
- Quick Win Mobile conversion rate monitored for 30 days post-optimization
Section 9: Maintenance Checklist
Optimization without maintenance reverts. Most stores that score well at launch regress to poor scores within 6 to 12 months without a maintenance discipline.
Monthly Checks
- Quick Win PageSpeed Insights run on homepage, top product page, and top collection page on the first of every month
- Quick Win Scores logged and compared to previous month - any drop of 5+ points triggers investigation
- Quick Win Chrome DevTools Network tab opened on homepage to count external script domains
After Every App Installation
- Quick Win PageSpeed test run within 48 hours of installing any new app
- Quick Win New app's script domain identified in Network tab and script size measured
- Developer App script restricted to relevant page templates if it loads globally by default
- Quick Win Decision made immediately: does the app's value justify its performance cost?
After Every Theme Update
- Quick Win PageSpeed tested within 24 hours of applying any theme update
- Developer Theme update reviewed for changes to image loading attributes, script loading, or added libraries
- Developer Critical CSS reviewed - new above-fold sections may require re-extraction
- Developer Custom modifications verified to still be present after update
Quarterly App Audit
- Quick Win Full app list reviewed with all stakeholders
- Quick Win Each app evaluated: measurable revenue contribution confirmed, lighter alternative considered
- Quick Win Apps not actively used in past 60 days flagged for removal
- Developer GTM container audited for inactive tags from removed tools
- Quick Win Monthly app spend reviewed - apps not providing value removed regardless of cost
Annual Full Audit
- Quick Win Full audit run against this complete checklist
- Developer Shopify Theme Inspector run on all primary page templates
- Quick Win Image library audited for newly uploaded uncompressed images
- Quick Win Font loading verified - confirm no additional weights or families added during the year
- Developer Performance monitoring setup reviewed and confirmed still active
Section 10: Master Shopify Speed Checklist
This summary distills the highest-impact items across all nine categories. If you can only complete one checklist, complete this one first.
1. Images - Do These First
- All hero and product images converted to WebP
- Hero image under 150KB, product images under 100KB
- All
<img>tags have explicitwidthandheightattributes - LCP image has
loading="eager"andfetchpriority="high"- neverloading="lazy" - All below-fold images have
loading="lazy"
2. JavaScript and Apps - Do These Second
- All apps with unknown or unmeasured business value removed
- All remaining app scripts restricted to relevant page templates
- All tracking pixels consolidated into Google Tag Manager
- All non-critical
<script>tags intheme.liquidusedefer - All scroll and touch event listeners use
{ passive: true }
3. Liquid and Server - Do These Third
- No Liquid snippet rendering above 100ms (verified with Theme Inspector)
- All collection loops wrapped in
{% paginate %}with 24 or fewer products per page - No metafield lookups inside collection loops without variable assignment
4. LCP and Render Path - Do These Fourth
- LCP image preloaded in
<head>withimagesrcsetandimagesizes - Preconnect to
cdn.shopify.comwithcrossoriginin<head> -
font-display: swapon all custom font declarations
5. CLS Prevention - Do These Fifth
- Announcement bar server-side rendered with fixed height
- Cookie consent banner uses
position: fixed
6. Testing and Monitoring - Always
- Monthly PageSpeed checks scheduled and recurring
- Google Search Console Core Web Vitals report reviewed monthly
Shopify Speed Optimization Benchmarks
| Store Type | Current Typical | After Full Optimization |
|---|---|---|
| New store, 3 apps, Dawn theme | 75-85 | 88-95 |
| Standard store, 8 apps, premium theme | 55-65 | 75-85 |
| Established store, 12 apps, customized theme | 40-55 | 68-78 |
| Large catalog, 15+ apps, heavy customizations | 30-45 | 58-72 |
Core Web Vitals targets:
| Metric | Good | Needs Improvement | Poor |
|---|---|---|---|
| LCP | Under 2.5s | 2.5s to 4.0s | Above 4.0s |
| CLS | Under 0.1 | 0.1 to 0.25 | Above 0.25 |
| INP | Under 200ms | 200ms to 500ms | Above 500ms |
Page weight targets:
| Page | Target Weight | Maximum Acceptable |
|---|---|---|
| Homepage (mobile) | Under 1MB | Under 2MB |
| Product Page (mobile) | Under 1.5MB | Under 2.5MB |
| Collection Page (mobile) | Under 1.2MB | Under 2MB |
JavaScript targets:
| Metric | Target | Warning Threshold |
|---|---|---|
| Total JS on homepage | Under 200KB | Above 400KB |
| External script domains | 3 or fewer | Above 6 |
| Total Blocking Time | Under 200ms | Above 400ms |
Tools Reference
- Google PageSpeed Insights: pagespeed.web.dev
- WebPageTest.org: filmstrip view and waterfall analysis
- GTmetrix: waterfall and frame-by-frame video
- Chrome DevTools: Network, Coverage, Performance, and Lighthouse tabs
- Shopify Theme Inspector: Chrome extension for Liquid render times
- Squoosh.app: individual image compression with quality comparison
- Sharp (Node.js): batch image conversion for large catalogs
- TinyPNG/TinyJPG: quick batch JPEG and PNG compression
- PurgeCSS: unused CSS removal
- PenthouseJS: critical CSS extraction
- Font Style Matcher: fallback font metric matching
- Google Search Console: Core Web Vitals field data
- Web Vitals library: real user metric collection for GA4
- Lighthouse CI: automated performance testing in deployment workflow
- requestmap.webperf.tools: visual third-party connection mapping
Summary
Ten checklists, 180+ actionable items, covering every performance layer from image format to quarterly maintenance. The order is the method: images first, apps second, code third, render path fourth, CLS fifth, mobile sixth, Core Web Vitals throughout, testing always, maintenance permanently.
The performance gap between a 35 and an 80 on mobile PageSpeed is not mysterious. It is every unchecked item on this list - images in the wrong format, apps loading globally when they should load conditionally, JavaScript blocking rendering that should be deferred, and Liquid templates iterating far more data than the page needs to display.
For stores working through the image optimization and script management sections specifically, Ecom: Page Speed Expert handles these categories systematically within Shopify's native architecture - the foundational layer that all advanced checklist items build on top of.
Start with Section 10. Finish with Section 9. Repeat indefinitely.