Minification refers to the method of removing unnecessary or redundant data while not affecting how the resource is processed by the browser - e.g. code comments and data formatting, removing unused code, using shorter variable and function names, and so on.

When it comes to generating a page or running a script, internet browsers aren’t concerned regarding the readability of code. Minification strips a code file of all information that isn’t needed in order for the file to be executed. Not like usual compression techniques, minified files don’t need to be decompressed before they'll be read, changed or executed.

Minification is performed when the code for a web application is written, but before the application is deployed. Once a user requests a webpage, the minified version is distributed rather than the complete version, leading to faster response times and lower bandwidth costs.

When making HTML, CSS and JavaScript (JS) files, developers tend to use spacing, comments and well-named variables to create code and markup readable for themselves. It also helps others who would possibly later work on the assets. While this can be a positive score within the development phase, it becomes a negative once it comes to serving your pages. Web servers and browsers will parse file content without comments and well-structured code, each of that produce extra network traffic without providing any functional benefit.

To minify JS CSS and HTML files, comments and additional spaces need to be removed, as well as variable names thus resulting minimized code and reduce file size. The minified file version provides identical functionality and reducing the bandwidth of network requests.

Example Normal JS
// The following variables are defined in the global scope
var num1 = 20,
    num2 = 3;

// This function is defined in the global scope
function multiply() {
  return num1 * num2;
}

Minified Result
var num1=20,num2=3;function multiply(){return num1*num2}

How to minify HTML, JS, CSS

To minify resource, itcan be done by removing white space and unused line manually or by using tools.
For further reading, see Google Developer Insight page at MinifyResources tutorial minification

Share This

10 comments:

  1. This is an awesome post. Really very informative and creative contents. This concept is a good way to enhance knowledge. I like it and help me to development very well. Thank you for this brief explanation and very nice information. Well, got good knowledge.
    WordPress development company in Chennai

    ReplyDelete
  2. Thank you dear, I found your information really useful. I would like to say thanks once again for this information. keep posting all the new information.
    Minnesota Web Design
    rochester MN web design

    ReplyDelete
  3. The blog you have shared is incredibly helpful. The tips you have shared related to web development is really informative. Thanks for sharing this blog!
    Hire Opencart Developer
    Hire Php Programmer
    Hire Web Developer
    Hire wordpress developer India
    Hire a Programmer

    ReplyDelete
  4. Hi Everybody
    I am new here this community. I like your article. I am working for DFS Services. we are best service provide.
    thank you
    burglar alarm
    security systems
    security cameras
    home security system Chennai

    ReplyDelete
  5. This article is awesome. meanwhile I have also written one article on Monitors and technology. So if you want to check it out then you can click here for more information related to Monitors

    ReplyDelete
  6. Thanks,for this article. Ifn you are looking for best monitors for photoshop then you should check my article on best monitors for photoshop. All these monitors are tested and having great for click here for more information related to Monitors

    ReplyDelete
  7. This article is awesome. meanwhile I have also written one article on Monitors and technology. So if you want to check it out then you can click here for more information related to Monitors

    ReplyDelete
  8. Hi Everybody
    I am new here this community. I like your article. I am working for Qntime. we are best service provide.
    We are providing useful information about the Popular Indian and International Celebrities & people who are in the news. Qntimes.com Wеbѕіtе’ѕ fосuѕ іѕ оn Сеlеbrіtіеѕ & Bollywood Stars Wiki, Wife, Age, Height, Girlfriend, Boyfriend, Real Facts, Movie List, Awards, Controversies, car collections, Favriots, Affairs, Family, About In, Biography & More, Nеwѕ, Gоѕѕір, еntеrtаіnmеnt, nеt wоrth аnd lіfе оf сеlеbrіtіеѕ.
    Suhana Khan Age
    Qntimes

    ReplyDelete
  9. Hello every one
    I am new here for this group.
    For the best deal (Shhhh…. Something special we are talking about) for desert safari tour, Contact Us. You can mail us or call us. We have some special offer running for a limited period of time. Avail your discount today!
    Evening Desert Safari Dubai
    Best Desert Safari Dubai

    ReplyDelete

About
Creative Commons License
Blogger Book is licensed under a Creative Commons Attribution-NonCommercial 3.0 Unported License.
Misc