Minification
/ˌmɪnɪfɪˈkeɪʃən/ · noun · web performance
Minification removes characters code doesn't need to run, such as whitespace, comments and long local names, to make files smaller.
In more detail
Minifying JavaScript, CSS or HTML strips the parts that only help people read the code. The browser runs the minified file exactly as it would run the original, but has fewer bytes to download and parse.
Minification is a normal step in production builds. Tools such as Terser for JavaScript and cssnano or Lightning CSS for stylesheets do it automatically.
What a minifier changes
A basic minifier removes comments, line breaks and indentation. A JavaScript minifier goes further: it shortens local variable names, drops code that can never run and folds constant expressions such as 60 * 60 into 3600. It keeps property names and anything other scripts may depend on, so the behavior stays the same.
Minified code is hard to read, but it is not protection. A beautifier restores the layout, though the original local names and comments are gone.
Minification and compression
Servers also compress text files with gzip or Brotli. Compression shrinks repeated patterns, while minification removes characters altogether. The two work together, and a minified, compressed file is the smallest to send.
Key points
- Minification removes characters code doesn't need, without changing behavior.
- JavaScript minifiers also shorten local names and remove dead code.
- Use it alongside gzip or Brotli compression on the server.