Key takeaways
- Unused code accumulates from uninstalled apps, old theme customizations, and unused sections.
- Use Shopify Theme Inspector (Chrome extension) to identify which assets are slowest to load.
- Find orphaned snippets and sections by searching for their filenames in your theme’s Liquid files.
- Always work on a duplicate theme. Removing wrong code breaks your store.
Every time you install an app, try a customization, or update your theme, code accumulates. Dead CSS. Script tags for apps you uninstalled two years ago. Snippet files that nothing renders. Over time, this unused code makes your store slower without adding any value.
Cleaning it up is one of the most effective performance improvements you can make — and it costs nothing except time.
How do I delete code in Shopify?
Go to Online Store → Themes → Actions → Edit code. This opens the code editor where you can view all theme files. Individual files can be edited or deleted here.
Critical reminder: duplicate your theme before touching any code. Online Store → Themes → three-dot menu → Duplicate.
Step 1 — Identify what’s slow with Theme Inspector
The Shopify Theme Inspector is a free Chrome extension that shows which Liquid templates and assets take the longest to render.
How to use it:
- Install the extension from the Chrome Web Store
- Open your store and press F12 to open Chrome DevTools
- Switch to the “Theme Inspector” tab
- Navigate around your store — the extension shows rendering time per template
This tells you which pages and assets are contributing most to slow load times. Focus cleanup efforts on the worst offenders.
For JavaScript specifically: open Chrome DevTools → Network tab → filter by JS → reload the page. Sort by Size to find the largest scripts. Are any of them from apps you no longer use?
Related: Minify CSS and JavaScript in Shopify.
How to remove unused JavaScript in Shopify
Leftover app scripts in theme.liquid. The most common source of unused JavaScript. Open theme.liquid in the code editor and search for script tags referencing third-party domains from apps you’ve uninstalled.
<!-- Example leftover script from an uninstalled popup app -->
<script src="https://privy.com/scripts/privy.js"></script>Delete the entire <script> tag if the app is no longer installed.
Related: Remove Leftover App Code from Shopify.
Unused JavaScript files in assets/. Open the assets/ folder in the code editor. Look for .js files with names that reference apps or features you no longer use. Search for the filename in your theme’s Liquid files — if nothing renders or includes the file, it can be removed.
Section JavaScript blocks. If you’ve deleted a section from all your templates but left the section file, its {% javascript %} block still compiles into your theme’s main JavaScript bundle. Delete unused section files entirely.
How to remove unused CSS
Unused stylesheet files in assets/. Look for .css files from old apps or customizations. Same process: search for the filename in Liquid files to see if anything loads it.
Dead CSS in base.css. CSS rules written for sections or elements that no longer exist. This is harder to audit automatically. Tools like PurgeCSS (not a Shopify-native tool, but useful for analysis) can identify CSS selectors that don’t match any HTML on your live pages.
The practical approach: focus on removing clearly named, clearly outdated CSS blocks rather than trying to audit every rule in base.css. The biggest wins come from removing entire stylesheets, not individual rules.
How to find and remove orphaned snippets
A snippet is “orphaned” if no template, section, or other snippet renders it.
Finding orphaned snippets:
- Go to the snippets/ folder in the code editor
- For each suspicious file (especially ones with app names), search your entire theme for the snippet’s filename
- Search for
{% render 'snippet-name' %}or{% include 'snippet-name' %} - If no results: the snippet is orphaned and can be deleted
Related: Fix Layout Issues After Installing Shopify Apps.
Common orphaned snippets: files named after apps (loox-widget.liquid, privy-form.liquid), old feature snippets from previous theme customizations, and duplicate snippet versions.
How to find unused sections
Sections are used if they’re referenced in a template’s JSON file or rendered by another section.
Check template files:
- Open the templates/ folder
- Each
.jsontemplate file lists which sections appear on that page type - If a section file exists but isn’t listed in any template, it’s unused (though it may be accessible via “Add section” in the Theme Editor)
For sections that were added to a page once and then removed, they may no longer appear on any page but the file still exists. These are safe to delete.
Priority order for cleanup
Not all unused code has the same performance impact. Focus in this order:
- External scripts (app script tags in theme.liquid) — each one is an HTTP request to an external server
- Large JavaScript files in assets/ — especially anything over 50KB
- Unused CSS stylesheets — especially ones loaded on every page via theme.liquid
- Orphaned snippets and sections — smaller impact but good housekeeping
Related: Speed Up a Shopify Theme.
Using Shopify’s built-in theme check
Shopify’s theme development tools include Theme Check, which flags a range of code issues including unused variables and deprecated Liquid syntax. For merchants (as opposed to developers), this is harder to access — it’s primarily a CLI tool.
The Shopify code editor does surface some basic warnings, and the Theme Inspector covers the performance side well enough for most cleanup tasks.
FAQ
Depends on how much there is. Removing a single 200KB JavaScript file from a previously-uninstalled app can drop LCP by 0.5–1 second on slow connections. Removing a few KB of unused CSS won't move the needle. The biggest gains come from eliminating entire HTTP requests (third-party scripts), not minor file size reductions.
Tools like PurgeCSS or Chrome DevTools Coverage tab (Cmd+Shift+P → "Show Coverage") highlight unused CSS on a page. Manual approach: search the rendered HTML for any element matching the selector. Caution: a rule may look unused on the homepage but be used on a different page (e.g., product page only).
Generally no — modifying base theme code makes future theme updates messy (Shopify rebuilds your theme on update, overwriting changes). Better: leave the code in place but disable the feature via Theme Editor settings. Only edit theme code when the gain (speed, security) clearly outweighs maintenance cost. If you want to replace a heavy built-in feature with a lighter custom equivalent, describe what you want to Fudge and it adds the replacement as a new section (preserving the original theme code for safe theme updates).
The code editor includes Theme Check warnings for some references (broken {% render %} calls, missing assets), but won't catch all dependencies. Always preview your theme on a duplicate after deletions before publishing — silent breakage often only shows on specific page types or under specific conditions.
Quarterly for active stores or after major app changes. Annual for stable stores. The cleanup compound interest is real — three years of accumulated app cruft can add 1–2 seconds to mobile LCP. Cleanup paired with a theme update (or rebuild on a fresh theme) often produces dramatic improvements.
