componentjs / builder.js

v0.x of the builder. v1.0.0+ is located at:
https://github.com/component/builder2.js
71 stars 39 forks source link

Add detailed size information to verbose output... #100

Closed andyburke closed 11 years ago

andyburke commented 11 years ago

Hi,

It would be nice if verbose output had a more detailed breakdown of what each component is adding to your project size, eg:

component build -v

  component: foo
    js: 10kb
    css: 2kb
    assets: 20kb

    total: 32kb

  component: bar
    js: 2kb

    total: 2kb

------------------------

       write : build/build.js
       write : build/build.css
          js : 214kb
    duration : 31ms

I'm willing to attempt adding this and sending a pull request, but I wanted to open an issue first for two reasons:

1) I'd like to know if there are reasons this would not be a desired feature so I don't undertake the work if there's no chance it would make it in.

2) If I could get any pointers on how I might jump into this task, I'd appreciate it.

I assume I'd want to look at each of these and do some resource tracking within each:

  batch.push(this.buildScripts.bind(this));
  batch.push(this.buildAliases.bind(this));
  batch.push(this.buildStyles.bind(this));
  batch.push(this.buildImages.bind(this));
  batch.push(this.buildFonts.bind(this));
  batch.push(this.buildFiles.bind(this));

Then somewhere I'd check the verbose flag and if set, output information about each component we built.

Now, of course, these sizes wouldn't necessarily equate to exactly what you'd be paying after minification for deployment, but they'll at least give you a ballpark idea on the cost of each of the components you're using.

Thanks!

tj commented 11 years ago

I like the idea, but I think we should maybe do it in component-ls, that way we can just do a bunch of stat()s