What is minification?
Code is written for people. It has indentation, line breaks, long descriptive names and comments explaining what each part does. A browser needs none of that. Minification is the automated step that removes it, turning a readable stylesheet or script into one dense line that does exactly the same thing in fewer bytes. A JavaScript minifier also shortens variable names and drops code that can never run; a CSS minifier merges duplicate rules and trims values; an HTML minifier removes the whitespace between tags.
It is related to, but different from, compression. Minification changes the file itself. Compression, usually gzip or Brotli applied by the server, packs the file for the journey and the browser unpacks it on arrival. The two work best together, because a minified file also compresses smaller. Compression is undone on arrival; minification is not, which is why the readable source is always kept and only the minified copy is published.
Why it matters
Why minification matters
Every byte of CSS and JavaScript has to be downloaded and processed before a page can look right and respond, and on a phone with a weak signal that wait is exactly what a visitor feels. Minification takes a meaningful share off the size of most scripts and stylesheets before compression even starts, which shortens load times, lowers bandwidth costs and helps the page speed measures search engines look at. It is not a cure for a bloated site, but it is the cheapest saving available, and leaving it out means paying a small tax on every visit for nothing.
In practice
How minification works in practice
- 01
Nobody minifies by hand. In a modern build process a bundler (Vite, webpack, esbuild and their peers) minifies scripts and styles automatically every time the site is built for production, using tools such as Terser for JavaScript and cssnano or Lightning CSS for stylesheets. The developer keeps working on the readable source; the server only ever sends the compact version. A source map links the two, so an error on the live site can still be traced to the right line of the original.
- 02
On a content management system such as WordPress, minification is often handled by a caching or performance plugin, or by the host or CDN at the edge. Either way it needs testing: aggressive settings that combine and reorder files can break scripts that depend on loading in a particular order. The check is simple. Build, deploy to staging, click through the pages that matter and watch the browser console for errors.
Watch out
What people get wrong about minification
Treating it as a performance strategy. Minifying two megabytes of unused JavaScript still sends a lot of unused JavaScript; the bigger win is removing code, not squeezing it. Second, stacking tools, so the theme, a plugin and the CDN all minify the same file and one of them breaks it. Third, minifying without source maps and then trying to debug a live error on a single line that is forty thousand characters long. And the opposite: skipping it because each file looks small, when a page is built from dozens of them and the savings add up on every visit.
