Search code examples
javascriptdevelopment-environmentproduction

Why do we need to use uncompressed files for development?

I have been wondering why do we need uncompressed files for development and minified for production? I mean what are the benefits of using uncompressed files over minified?

Do they give you better error messages or is it just that if we want to look something up we can go through code of uncompressed files?

Might be dumb question to some of you but I never had habit of going through code of well known big libraries and if I am not wrong, very few people do it.

Solution

  • The main reason for this is usability. When a js-file is minified and you've got an Error and trying to find a place where it is located, what would you find? just a minified string like 

    (function(_){var window=this,document=this.document;var ba,ea,fa,ha,la,na,oa,pa,qa,sa,ra,ta,wa,xa,za,Aa,Da,Ea,Fa,Ga,Ia;ba=function(a){return function(){return _.aa[a].apply(this,arguments)}};ea=function(a){return ca(_.p.top,a)||ca(da(),a)};_.aa=[];fa="function"==typeof Object.create?Object.create:function(a){var b=function(){};...

    and so on. Is it readable for you? I don't think so. It's not readable at all.

    For a much better understanding of the code, you need to uncompress it. It will add some additional spaces and format the code in a much readable way. so it would look like:

    (function(){
  var b = j(),
      c = k (b);
})();

    It allows you to move from one piece of code to another and discover the code or search your error inside.

    Also, for production, you need not only minify your code but compress it as well. So, it would be nice to use Uglify library for that. It removes unnecessary spaces, rename variables, objects and functions for much smaller names like a or b12. It increases downloading speed.

    Hope it helps you.