Minification (programming)
Minification (also minimisation or minimization) is the process of removing all unnecessary characters from the source code of interpreted programming languages or markup languages without changing its functionality. These unnecessary characters usually include white space characters, new line characters, comments, and sometimes block delimiters, which are used to add readability to the code but are not required for it to execute. Minification reduces the size of the source code, making its transmission over a network (e.g. the Internet) more efficient. In programmer culture, aiming at extremely minified source code is the purpose of recreational code golf competitions.
Minification must not be confused with obfuscation; the former can be readily reversed using a pretty-printer. Minification can be distinguished from the more general concept of data compression in that the minified source can be interpreted immediately without the need for an uncompression step: the same interpreter can work with both the original as well as with the minified source.
Example
For example the JavaScript code
var array = [];
for (var i = 0; i < 20; i++) {
array[i] = i;
}
is equivalent to but longer than
for(var a=[i=0];i<20;a[i]=i++);
History
In 2001 Douglas Crockford introduced JSMin,[1] which removed comments and whitespace from JavaScript code.[2] It was followed by YUI Compressor in 2007.[2] In 2009, Google opened up its Closure toolkit, including Closure Compiler which contained a source mapping feature together with a Firefox extension called Closure Inspector.[3] In 2010, Mihai Bazon introduced UglifyJS, which was superseded by UglifyJS2 in 2012; the rewrite was to allow for source map support.[4]
Source mapping
Source maps allow tools to display unminified code from minified code with an optimized "mapping" between them. The original format was created by Joseph Schorr as part of the Closure Inspector minification project.[5] Updates as versions 2 and 3 reduced the size of the map files.[5]
Types
Tools
Visual Studio Code comes with minification support for several languages. It can readily browse the Visual Studio Marketplace to download and install additional minifiers.
JavaScript optimizers which can minify and generate source maps include UglifyJS and Google Closure Compiler. In addition, certain online tools, such as Microsoft Ajax Minifier,[6] the Yahoo! YUI Compressor or Pretty Diff,[7] can compress CSS files. For minification of HTML code there are the following tools: HtmlCompressor,[8] HTMLMinifier[9] and WebMarkupMin.[10] There is a Power-Shell script named "minifyPS"[11] that is able to shrink PowerShell script code as well as JavaScript code.
Web development
Components and libraries for Web applications and websites have been developed to optimize file requests and reduce page load times by shrinking the size of various files.
JavaScript and Cascading Style Sheet (CSS) resources may be minified, preserving their behavior while considerably reducing their file size. Libraries available online are capable of minification and optimization to varying degrees. Some libraries also merge multiple script files into a single file for client download. JavaScript source maps can make code readable and debuggable even after it has been combined and minified.[12]
References
- Crockford, Douglas (11 September 2001). "JSMin: The JavaScript Minifier". Crockford.com. Self-published.
- "Code minification". webplatform.github.io. The WebPlatform Project. Archived from the original on 24 April 2016.
- Paul, Ryan (6 November 2009). "Google opens up its JavaScript development toolbox to all". Ars Technica. Condé Nast.
- Bazon, Mihai (8 November 2012). "Should you switch to UglifyJS2?". lisperator.net. Self-published.
- "Source Map Revision 3 Proposal". Google Docs. Retrieved 16 April 2016.
- Microsoft Ajax Minifier. Ajaxmin.codeplex.com (13 September 2012).
- Pretty Diff. Pretty Diff.
- HtmlCompressor. code.google.com/archive/p/htmlcompressor (11 February 2017).
- HTMLMinifier. github.com/kangax/html-minifier (11 February 2017).
- WebMarkupMin. github.com/Taritsyn/WebMarkupMin (11 February 2017).
- minifyPS. Minifyps.codeplex.com (22 February 2012).
- http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/