🗜️ Minify CSS and JS

Strip out everything in your code files that the browser doesn't need — spaces, line breaks, comments — so files are smaller and pages load quicker.

Who can use this feature?

Minify CSS and JS is available on the Expert plan

What is Minify CSS and JS?

Your theme's code files have a lot of extra characters in them: blank lines, indentation, developer comments. Those are great for humans reading the code, but the browser doesn't care about any of it.

Minifying removes all that fluff. The code still works exactly the same — it's just much smaller. Smaller files load faster, which lifts your speed score.

Why use Minify CSS and JS?

Smaller code files — removes spaces, line breaks, and comments the browser doesn't need.
Faster page loads — lighter files download quicker, lifting your speed score.
Zero functional change — the code behaves exactly the same, just leaner.
Set and forget — turn it on once and apply; re-run after code edits.

⚙️ How to use Minify CSS and JS

Step 1: Open Self-optimize

Go to Speed up → Self-optimize.

[Screenshot: Speed up page with Self-optimize tab open]

Step 2: Turn on Minify CSS and JS

Turn on Minify CSS and JS.

[Screenshot: Minify CSS and JS toggle switched on]

Step 3: Apply to your theme

Click Speed up now and pick a theme to apply changes.

[Screenshot: Speed up now button and theme selection modal]

Step 4: Verify it's working

To check it's working, open your theme's Assets folder in the Shopify code editor. Optimized files have "min" or "minified" in their names.

[Screenshot: Shopify code editor showing assets folder with minified files]

📌 Merchant Notes

Edited your theme code? Click Speed up now again to re-minify the updated files.
Minifying doesn't change how your code behaves — it only removes characters the browser ignores.
This feature requires the Expert plan.
For an overview of all optimization features, see Speed up.

Last updated 2 days ago