Why Apps Leave Code Behind
When you install a Shopify app, it often modifies your theme to add its functionality. This might include injecting scripts into theme.liquid, adding snippet files, or embedding liquid code in specific templates.
When you uninstall the app, Shopify removes the app itself but frequently leaves the theme modifications in place. This happens because Shopify cannot always determine which code belongs to which app, especially if the theme has been modified by multiple apps over time.
Common Types of Leftover Code
- •JavaScript includes: Script tags loading external JS files
- •CSS stylesheets: Link tags for app-specific styles
- •Liquid snippets: Include statements referencing app files
- •Asset files: JS and CSS files in your theme's assets folder
- •App embeds: Code injected via app embeds in theme settings
Performance Impact
Leftover app code can significantly impact your store's performance. Even if the main app functionality is gone, the code still loads and executes on every page view.
Blocking Resources
JavaScript files in the head of your document block rendering until they load. Even a 50KB unused script delays your page display.
Failed Network Requests
Scripts trying to load from app servers that no longer respond create failed requests, adding latency and console errors.
JavaScript Errors
Orphaned code may throw errors when it cannot find elements or dependencies it expects, potentially breaking other scripts.
Real World Impact
We regularly see stores with 5-10 uninstalled apps still loading scripts. Cleaning these up can improve page load times by 1-3 seconds and significantly boost Lighthouse scores.
Identifying Leftover Code
Before removing anything, you need to find the residual code. Here are the methods to identify it.
Using Browser DevTools
- 1.Open your store in Chrome and press F12 to open DevTools
- 2.Go to the Network tab and reload the page
- 3.Filter by JS and CSS to see all loaded scripts and styles
- 4.Look for requests to external domains you do not recognise
- 5.Check for failed requests (shown in red) which indicate dead app scripts
Using Page Source
- 1.Right-click on your page and select "View Page Source"
- 2.Search (Ctrl+F) for common app indicators: "app-embed", "cdn.shopify", app names
- 3.Note any script or link tags that reference apps you have uninstalled
Checking Theme.liquid
The theme.liquid file is the most common location for app code injection. Apps typically add their scripts just before the closing head or body tags.
- 1Open Theme Code
Go to Online Store > Themes > Actions > Edit code. Open the theme.liquid file from the Layout folder.
- 2Search for App References
Use Ctrl+F to search for app names, "snippet", "include", and external script sources. Look for comments like "Start App Name" or "Added by App Name".
- 3Check Near Head and Body Tags
Scroll to just before </head> and </body>. These are common injection points for app scripts.
/* Example of leftover app code */
<!-- Start ReviewApp -->
{% include 'review-app-script' %}
<script src="https://cdn.reviewapp.com/widget.js"></script>
<!-- End ReviewApp -->Important: Backup First
Before making any changes, duplicate your theme using Actions > Duplicate. Work on the duplicate first and test thoroughly before making changes to your live theme.
Removing App Snippets
Apps often create snippet files that remain after uninstallation. These need to be removed along with any references to them.
Finding App Snippets
- 1.In the theme code editor, open the Snippets folder
- 2.Look for files with app names or unfamiliar prefixes
- 3.Open suspicious files and check if they reference the uninstalled app
- 4.Search your entire theme for references to these snippets before deleting
Safe Removal Process
- 1.Remove all include statements referencing the snippet from other files
- 2.Delete the snippet file itself
- 3.Preview your theme to ensure nothing is broken
- 4.Check the browser console for new errors
Cleaning Asset Files
Apps may add JavaScript and CSS files to your theme's assets folder. These files continue loading even after the app is removed.
Identifying App Assets
Open the Assets folder in your theme code editor. Look for files that:
- •Have app names in their filename
- •Were created around the same time the app was installed
- •You do not recognise as part of your theme
Before Deleting
Search your entire theme for references to the asset file before deleting. Use the theme editor's search function to find any link or script tags referencing the file.
/* Search for patterns like these */
{{ 'app-name.css' | asset_url | stylesheet_tag }}
{{ 'app-name.js' | asset_url | script_tag }}
<script src="{{ 'app-name.js' | asset_url }}"></script>Verification and Testing
After removing code, verify that your store works correctly and that performance has improved.
Testing Checklist
- 1.Preview your theme and navigate through all page types
- 2.Check the browser console for new JavaScript errors
- 3.Test the checkout process with a test order
- 4.Verify all remaining apps still function correctly
- 5.Run PageSpeed Insights before and after to measure improvement
Network Tab Verification
Re-check the Network tab in DevTools. Confirm that the removed scripts are no longer loading. Failed requests should be eliminated.