a quick and dirty tool to know what is taking up space in a bundle

calorimetre.js

// a quick and dirty tool to know what is taking up space in a bundle
// this should be made generic
// USAGE:
//  - save it somewhere
//  - replace `entryFile` with the path to your entry point
//  - check that the browserify options make some sort of sense
//  - run it
// The output will be a long list of dependencies. The first is the entry point, after that they're ordered
// by size. Each lists its size and what includes it. You can use that to get a feel for what can be usefully
// optimised out.
var exec = require('child_process').exec
  , chalk = require('chalk')
  , fs = require('fs')
  , jn = require('path').join
  , entryFile = jn(__dirname, '..', 'src/client.js')
  , depsJSON = jn(__dirname, 'deps.json')
  , bfy = jn(__dirname, '..', 'node_modules/.bin/browserify')
;
exec(`${bfy} -t babelify --deps ${entryFile} > ${depsJSON}`, function (err, stdout, stderr) {
  var files = {}
    , incBy = {}
    , deps = require(depsJSON)
  ;
  deps.forEach(function (dep) {
    files[dep.file] = {
      size:   dep.source.replace(/^\/\/# sourceMap.*/m, '').length
    , entry:  !!dep.entry
    };
    for (var k in dep.deps) {
      var includes = dep.deps[k];
      if (!incBy[includes]) incBy[includes] = {};
      incBy[includes][dep.file] = true;
    }
  });
  var keys = Object.keys(files)
                  .sort(function (a, b) {
                    if (files[a].entry) return -1;
                    if (files[b].entry) return 1;
                    if (files[a].size > files[b].size) return -1;
                    if (files[a].size < files[b].size) return 1;
                    return 0;
                  })
  ;
  keys.forEach(function (k) {
    console.log(chalk.bold.red(k + (files[k].entry ? ' [entry]' : '')));
    console.log(chalk.green('  chars: ') + files[k].size);
    console.log(chalk.green('  included by:'));
    for (var inc in incBy[k]) console.log('        ' + inc);
  });
});