What are the advantages of minified javascript code?

Question

I'm reading the code of BemTv. Then I saw the strange Javascript code like below.

//n = {} , r = [5,1]
! function e(t, n, r) {
    console.log(t)
    function i(s, a) {
        if (!n[s]) {
            if (!t[s]) {
                var c = "function" == typeof require && require;
                console.log(require);
                if (!a && c) return c(s, !0);
                if (o) return o(s, !0);
                throw new Error("Cannot find module '" + s + "'")
            }
            var u = n[s] = {
                exports: {}
            };
            t[s][0].call(u.exports, function(e) {
                var n = t[s][1][e];
                return i(n ? n : e)
            }, u, u.exports, e, t, n, r)
        }
        return n[s].exports
    }
    for (var o = "function" == typeof require && require, s = 0; s < r.length; s++) i(r[s]);
    return i
}({
    1: [function(e, t) {
        "use strict";
        t.exports = e("./src/main")
    }, {
        "./src/main": 46
    }],
    2: [function() {}, {}],
    3: [function(e, t) {
        ...........

source: http://cdn.clappr.io/bemtv/latest/p2phls.min.js

My questions are:

1. What's the meaning of 'number' on the code line? It seems that index of result and return function object by index. Is it right?

2. Why does the author write the code like this? Are there any advantages for this kind of coding convention?

Answer 1

As @Jacob said.. Minified JavaScript means less bytes being downloaded from the client perspective.

Normally, developers will implement it in a full, commented version, and then use a tool like UglifyJs to generate a minified version.

It's common to see two versions of these files:

• myLib.js (the original version, meant to be included in development mode for debugging)
• myLib.min.js (the minified version, meant for production)

Moreover, with the rise of Node, it's becoming really common to implement your codebase as separate, readable modules and then use a bundling tool like Webpack and Browserify to generate a single bundle, that often contains not only your minified code, but also most of the dependencies in a single bundle.js. It's pretty straight forward.