Last updated
Code Minification Overview
Code minification removes unnecessary characters from source code — whitespace, comments, and long variable names — without changing functionality. The result is smaller files that load faster. Minification is a standard step in web build pipelines for JavaScript, CSS, and HTML.
Minification by Language
| Language | Tool | Typical Reduction |
|---|---|---|
| JavaScript | Terser, esbuild, UglifyJS | 40–70% |
| CSS | cssnano, clean-css, Lightning CSS | 20–40% |
| HTML | html-minifier-terser | 10–30% |
| JSON | JSON.stringify (no indent) | 10–20% |
| SVG | SVGO | 50–80% |
JavaScript Minification with Terser
import { minify } from 'terser';
const code = `
// Calculate factorial recursively
function factorial(n) {
if (n <= 1) return 1;
return n * factorial(n - 1);
}
console.log(factorial(10));
`;
const result = await minify(code, {
compress: {
dead_code: true,
drop_console: false,
passes: 2
},
mangle: {
toplevel: true
},
format: {
comments: false
}
});
console.log(result.code);
// → function n(r){return r<=1?1:r*n(r-1)}console.log(n(10));