What minified JavaScript looks like
Minifying JavaScript goes further than minifying CSS: as well as stripping whitespace and comments, it can safely rename local variables, because nothing outside the function can refer to them.
Before — 134 bytes
// Sum a list of prices
function totalPrice(itemList) {
let runningTotal = 0;
for (const item of itemList) {
runningTotal += item.price;
}
return runningTotal;
}After — 74 bytes
function totalPrice(t){let n=0;for(const o of t)n+=o.price;return n}Note what did not change: totalPrice keeps its name because it is exported and other code may call it, and .price keeps its name because it is an object property that could be accessed dynamically. Only the local itemList, runningTotal and item are shortened.
Minify, gzip and Brotli are not the same thing
These three are often treated as alternatives. They are not - they stack, and using all three gives a smaller result than any one alone.
| Minification | gzip | Brotli | |
|---|---|---|---|
| What it changes | Rewrites the source to be shorter | Compresses the bytes in transit | Compresses the bytes in transit |
| When it happens | Build time, once | Every response, by the server | Every response, by the server |
| What the browser receives | Shorter source | Compressed bytes, decompressed on arrival | Compressed bytes, decompressed on arrival |
| Helps parse time | Yes - there is genuinely less to parse | No - the file is identical once decompressed | No - the file is identical once decompressed |
| Typical extra saving | 20–40% on unminified JavaScript | 70–80% on text | Roughly 15–20% better than gzip |
The order matters: minify first, then let the server compress. Minification is the only one of the three that reduces work for the browser’s parser, because gzip and Brotli hand over exactly the same javascript they were given once decompression finishes. Compression is usually already switched on at the CDN, which is why minifying is the step most likely to be missing.
Related developer tools
What does minifying JavaScript do?
Minifying JavaScript strips whitespace, comments, and shortens local variable names without changing how the code behaves, commonly cutting 30–50% of an unminified file before gzip. Smaller scripts download and parse faster, which improves both page load and interaction responsiveness on slower devices.
Runs in your browser. Your files and text never leave your device - nothing is uploaded.