What’s the difference between a js file with . min and no . min?

Asked

Viewed 548 times

21

What is the file difference Javascript containing .min (for example jQuery.min.js)
and the file without the .min (for example jQuery.js)?

  • 2

    Related or duplicate: http://answall.com/q/88058/101. See also: http://answall.com/q/100977/101

  • 3

    @bigown I think the one that fits most in duplicate is with this http://answall.com/q/15019/3635

  • 4

    If someone is seeing this question in search of improving the loading time of a page or web system. It should be considered that although "minification" considerably decreases the size of Javascript and also CSS resources, a more advantageous approach is to serve compact features with gzip.

  • 1

2 answers

26


It is very common for libraries (or generally large files) to have a version .min, which means minified, compressed.

For example a Javascript file might look like this:

var jogadores = equipaA + equipaB;

and the minified version is like this:

var a = b + c;

This is done by a program that compresses Javascript files and whose function is to make the code smaller by decreasing the file size, making it lighter to download. In this case the program can turn this example line up into a shorter line, often with large size differences.

The program generates or renames variables to make them smaller, but retaining the functionality.

In the case of jQuery comparing to minified version with the non-minified version (also called, "development"/development or uncompressed) the difference is clear:

Compressed version: 104382 characters
Uncompressed version: 298444 characters (practically 3x larger)

  • 1

    And I thought it was just space removal and line breaking that minimized a file that way.

  • Although it is obvious to list the advantage of the uncompressed. "Normal" allows a better reading of the code. Modifying something in "min" becomes more difficult, because it does not have the "correct" names or comments on what is being done. Then use the "min" in the projects, but read and make necessary changes to the "normal".

5

The minified version (.min) is the result of a process called minification, that removes line breaks, spaces and unnecessary comments.

This process does not modify variable names.

The process that modifies the name of the variables is another and is called uglification.

  • Our now yes, after what you said makes sense.... I always wondered the projects that use Gruntfile the name of task not to be jsmin or something like css and yes be uglify, vlw dude :)

  • It is not true that a file .min has the names of the variables intact. See for example the version 1.12.3.min. js jQuery. It is a file .min and has modified variable names.

  • Yes, I believe that most libraries opt for both processes.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.