Minification is the process of shrinking code files, mainly CSS, JavaScript and HTML, by removing everything a browser does not need to run them: spaces, line breaks, comments and long variable names. The file works exactly the same but downloads faster.
How minification works
Developers write code to be readable by people, with indentation, comments explaining what each part does and descriptive names. Browsers do not need any of that. A minifier rewrites the file in its most compact form. A CSS rule spread over six lines with comments becomes a single line; in JavaScript, a variable called basketTotalIncludingVat may become a.
The savings depend on how the code was written. Heavily commented, hand-written files shrink noticeably, while libraries that already ship minified gain nothing. Minification is different from compression: compression with Gzip or Brotli happens on the server as files are sent and is undone by the browser, while minification changes the file itself. The two work best together.
It is usually handled automatically, by a build tool such as esbuild, Terser or cssnano on a custom site, by a performance plugin on WordPress, or by the platform itself on Shopify and most hosted builders. Do not assume your content delivery network is doing it: Cloudflare, for example, retired its Auto Minify setting in 2024, so sites that relied on it are now serving unminified files unless something else took over.
Why it matters
Smaller files arrive sooner, and CSS and JavaScript often block the page from displaying until they have loaded. On a mobile connection on a busy train, a few hundred kilobytes saved across a page can be the difference between a visitor seeing your content quickly and giving up.
Speed feeds into Core Web Vitals, particularly Largest Contentful Paint, and into how many visitors stay to enquire or buy. Minification alone rarely transforms a slow site, but it is cheap, low risk when tested, and easy to confirm in PageSpeed Insights.
Common mistakes
- Expecting it to fix a slow site. Oversized images, too many third-party scripts and slow hosting usually cost far more than unminified code.
- Combining and minifying everything blindly. Aggressive plugin settings can break menus, sliders, forms or checkout scripts. Test on a staging copy first.
- Minifying twice. A plugin, a theme and a CDN all minifying the same files can cause errors that are hard to trace.
- Editing the minified file. Changes should be made in the readable source and the file rebuilt, or they will be lost at the next update.
- Forgetting to clear caches. After switching minification on, old cached files can mask the change or cause mismatched styling.
How to act on it
Run your key pages through PageSpeed Insights or Lighthouse and check the performance diagnostics for unminified CSS or JavaScript, which name the files and the potential savings. In Chrome DevTools, a file whose preview shows readable indentation and comments has not been minified. If the files belong to your theme or plugins, switch on minification in one place only, usually your performance plugin or build process.
Test the pages that make you money after every change: the contact form, the booking flow, the basket and checkout. Then work on the bigger wins such as images, unused scripts and render-blocking resources. Prioritising speed fixes by impact is part of what I do in technical SEO.