Minification workflow
Shrink CSS and JavaScript to speed up your pages
Every kilobyte of CSS and JavaScript delays your page. Minification removes whitespace, comments, and formatting without changing behavior. The CSS minifier and JavaScript minifier work locally, and the page speed guide covers the image side of the same problem.
Minify in four steps
Keep the original file; the minified copy goes to production.
Open the minifier
Use the CSS minifier or the JavaScript minifier.
Paste or open the file
Paste the source or open a local file.
Minify
Whitespace and comments are removed in one pass.
Copy the output
Replace the production file and verify the page still works.
What minification changes
Minification strips whitespace, line breaks, and comments, and shortens some syntax where it is safe. The output behaves identically to the source for standards-compliant code.
For the biggest page-speed wins, combine minified code with compressed images using the image compressor and a server that serves gzip or brotli.
Minification mistakes
- Minifying source files and losing the readable original
- Breaking code that relied on line breaks in comments
- Forgetting to test after minification
Best practices
- Keep the readable original in version control
- Test the minified output in a staging environment
- Pair minification with compression on the server
Frequently asked questions
Does minification change how my code works?
No. It only removes whitespace and comments. Behavior stays identical for standards-compliant CSS and JavaScript.
Can I minify both CSS and JavaScript?
Yes. Separate tools handle each language, with the same local workflow.
How much smaller will my files be?
Most files shrink by 20 to 50 percent depending on how much whitespace and commenting they contain.
Is my code uploaded?
No. Everything runs locally in your browser.
Your code stays local
Minification runs in your browser. The source and the output never leave your device.
Open CSS Minifier