Minification in the context of JavaScript, and CSS is the process of removing all unnecessary characters from source code without changing its functionality. It is a fast and easy way to reduce usage of resources in web applications. Even with standard compression techniques, minification can improve the time needed to render a page by over 60%.
There are few codes which are used to add readability but such codes are not required while executing such applications. White space characters, new line characters, comments, and sometimes block delimiters are examples of a few such characters. During the early development and debugging stage these characters facilitate working with the code in order to improve the readability of coding. Such codes have no place once the application is in the execution stage. It will turn out to be extraneous, and become quite insignificant while executing the application. On the other hand, such elements result in increasing the size of code. Therefore, it is considered good practice to remove such characters before the deployment of application.
Minification is not like normal data compression. JavaScript and CSS codes will behave exactly the same even after it goes through the minification process. Code that has gone through the minification process is also known as “minified” code.
The process of minification will result in speeding up the downloading or transferring of JavaScript code from the server hosting the website’s JavaScript. The minification makes downloads go faster because it reduces the amount of data that needs to be downloaded. In effect, less data means that the user’s browser spends less time processing that data, and these results in time saving. So, we can say that minification is performed because it is essentially a performance enhancement and a bandwidth optimization technique – it allows websites that use minified code to load faster. With minification process, HTML, JavaScript, and CSS files are rewritten to provide identical functionality in a much smaller footprint.
Here are few benefits of minifcation process.
- Users load content faster as less unnecessary data needs to be downloaded. Users experience identical service without additional overhead.
- Enterprises see lower bandwidth costs as less data is transmitted over the network. The extra content that only developers care about is no longer being sent to users.
- Enterprises also see lower resource usage since less data needs to be processed for each request. The minified content – which only needs to be generated once – can be used for an unlimited number of requests.
Commonly used tools for JS minification are online JS minifier like YUI Compressor, Closure Compiler or JSMin and for CSS tools such as online CSS minifier like YUI Compressor or cssmin.js can be used.
Minifying websites can lead to large performance gains without compromising users’ experience. Hence, minification will have an influence in improving the ranking of a website as well.
