Shopify Code Analyzer
Extension Actions
- Live on Store
Identify dead code and orphaned scripts in Shopify stores. Analyzes apps, external scripts and Liquid.
Shopify Code Analyzer is a powerful browser extension that helps developers and store owners identify performance issues in their Shopify stores. It automatically detects:
- Ghost Scripts: Unused app scripts that are still being loaded
- Orphaned Liquid Comments: Leftover code comments from uninstalled apps
- Unknown Assets: Third-party scripts that may impact performance
- Performance Metrics: Script sizes and load times
The extension provides a comprehensive Theme Health Score (0-100) and categorizes findings into Active Apps, Ghost Scripts, and Unknown Assets. It also includes a visual testing tool to temporarily block scripts and measure their impact.
1. Platform Detection: Only activates on Shopify stores
- Detects `window.Shopify`
- Analyzes typical Shopify DOM structure
- Verifies Shopify scripts and meta tags
2. App Script Analyzer:
- Lists all external scripts (.js) being loaded
- Blacklist of known apps (Klaviyo, Judge.me, Hotjar, PageFly, Yotpo, etc.)
- Compares scripts with active DOM elements
- Identifies unused "ghost" scripts
3. Liquid Bloat Detector:
- Scans HTML for orphaned Liquid comments
- Detects `<!-- [shopify-app-extension] -->` comments without associated functionality
- Marks potentially dead code
4. Dashboard UI (Side Panel):
- Theme Health Score (0-100)
- Categorization: Active Apps, Ghost Scripts, Unknown Assets
- Size and load time metrics
- Modern interface with React and Tailwind CSS
5. Visual Cleanup Tool:
- Temporary script blocking using `declarativeNetRequest`
- Allows testing if a script is necessary
- Automatic reload to apply changes