How to minify code
- Choose JavaScript, CSS or HTML.
- Paste your code and click Minify.
- Copy or download the result. The size saving is shown below the boxes.
What minification does
| Language | What’s removed or shortened |
|---|---|
| JavaScript | Whitespace, comments, dead code; local variable names shortened (mangling); expressions simplified. Powered by Terser, the minifier used by webpack, Vite and Next.js. |
| CSS | Whitespace, comments and the last semicolon in each block; colors like #ffffff → #fff; 0.5 → .5; zero units dropped. |
| HTML | Comments and whitespace between tags; inline <style> is minified. Content inside <pre> and <textarea> is kept unchanged. |
License comments starting with /*! or containing @license are preserved.
Why minify?
Smaller files download and parse faster, which improves Core Web Vitals and page-speed scores — factors Google uses in ranking. Minification typically cuts JavaScript and CSS by 20–60% before gzip or Brotli compression, and the two savings stack. Images are usually the biggest files on a page, so also run them through the image compressor.
Good practice
- Always keep your original, readable source files — minified code is hard to edit.
- For larger projects, a build tool (Vite, webpack, esbuild) minifies automatically and generates source maps for debugging.
- If minified JavaScript breaks, check for missing semicolons in the original or code that relies on function names (turn off mangling).
Frequently asked questions
Is minified code safe to use in production?
Yes. Minification only removes characters the browser doesn’t need; the code behaves the same.
What is mangling?
Renaming local variables and functions to short names like a, b, c. It saves more bytes. Global names are never changed.
Can I un-minify code?
Formatting can be restored with a beautifier, but comments and original variable names are lost — keep your source files.
Is my code uploaded?
No. Minification runs entirely in your browser.