7 ms·

Show HN: Weightof.it – Compare JavaScript libraries by file size

25 points by stefanrush 11y ago

CSDude 11y ago
Nice comparisons site, but when I quickly mouse over thorugh list items, because of the animation it seems like a small earthquake is going on :)
- stefanrush 11y ago
  Really appreciate the feedback. Thank you. It's fixed :)
Rygu 11y ago
It doesn't seem to compare the minified + gzipped library sizes. That's the most important metric to me. Who still serves comments in JS?
- stefanrush 11y ago
  It compares the minified files so no comments. You raise a good point about gzipping though. I was operating under the assumption that the libraries would be compressed at the the same ratio so minified file size would be a good comparison. This probably isn't entirely accurate though. I'll have to look into it a bit more. Thanks for your feedback!
  - lifthrasiir 11y ago
    I would suggest the second metric to be labelled as "dry weight".
  - Rygu 11y ago
    To illustrate this point, React min+gzip is about 40 KB: https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.min.js https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.mi... not 121 KB.
    - stefanrush 11y ago
      I think what I'm going to do is add a checkbox at the top that will let you toggle between the gzipped and non-gzipped weight. After doing some research it looks like larger libraries with more redundancy will benefit more from gzipping than smaller libraries. So relative to uncompressed file size, React will be compressed more than say Backbone. Definitely going to add this in. Thanks again.
- stefanrush 11y ago
  I added that toggle gzip checkbox. Thanks again for the push.
ohitsdom 11y ago
Didn't look at the source- how are you determining popularity?
- stefanrush 11y ago
  GitHub stars
codingthebeach 11y ago
Nice! I had fun with this, especially comparing Ember's half a meg footprint to Backbone's 20K. One helpful data point could be whether the library supports a (formal) custom build apparatus, since you can often get a sizable reduction that way. Full jQuery UI clocks in at ~242K, but using http://jqueryui.com/download/ http://jqueryui.com/download/ you can often strip it down to 20K or less. Similarly with THREE.js and several others. Going in the other direction, a library that seems small (Backbone.js, @ ~20K) may actually end up being relatively heavy because of required external dependencies. A more explicit side-by-side "compare" function would also be nice here, comparing library size along with other metrics like script loader compatibility, maintenance frequency, different flavors of popularity, etc.
- yoran 11y ago
  It's not very fair to compare Ember's size with Backbone's as Backbone implements just a very small subset of Ember's functionality. Also, it seems that the sizes are outdated because the latest build of Ember.js is 478KB (see http://builds.emberjs.com/release/ember.min.js http://builds.emberjs.com/release/ember.min.js).
  - stefanrush 11y ago
    Thank you! I was actually unaware that Ember has separate versions for production and dev. I was using the dev version which I assume has extra features for debugging. I just updated it with the correct version. Sorry Ember...
    - yoran 11y ago
      No worries, thanks for correcting!
- Nemcue 11y ago
  Ember is ~75k gzipped, so that comparison is moot.
- stefanrush 11y ago
  Thanks for the feedback. Great point on modular libraries. I definitely thought about that during development. I just couldn't find a good way to implement it. Some libraries like Modernizr have billions of possible permutations. I also like the idea of comparing other metrics. Definitely something I'll look at going forward.
lhorie 11y ago
I just tried contributing a library but it's not showing up in the site. No error either.
- stefanrush 11y ago
  Thank you for contributing! I have approve them before they appear to prevent people from spamming. I just checked and was surprised to see 22 libraries awaiting approval. Awesome feeling. I was not expecting that. I'll be able to go through them tonight. I did just add a flash message users will see after they make a contribution though. Thanks for the feedback. And thanks to everyone who contributed a library.

25 points by stefanrush 11y ago

Nice comparisons site, but when I quickly mouse over thorugh list items, because of the animation it seems like a small earthquake is going on :)

stefanrush 11y ago
Really appreciate the feedback. Thank you. It's fixed :)

Rygu 11y ago

It doesn't seem to compare the minified + gzipped library sizes. That's the most important metric to me. Who still serves comments in JS?

stefanrush 11y ago
It compares the minified files so no comments. You raise a good point about gzipping though. I was operating under the assumption that the libraries would be compressed at the the same ratio so minified file size would be a good comparison. This probably isn't entirely accurate though. I'll have to look into it a bit more. Thanks for your feedback!
- lifthrasiir 11y ago
  I would suggest the second metric to be labelled as "dry weight".
- Rygu 11y ago
  To illustrate this point, React min+gzip is about 40 KB: https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.min.js https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.mi... not 121 KB.
  - stefanrush 11y ago
    I think what I'm going to do is add a checkbox at the top that will let you toggle between the gzipped and non-gzipped weight. After doing some research it looks like larger libraries with more redundancy will benefit more from gzipping than smaller libraries. So relative to uncompressed file size, React will be compressed more than say Backbone. Definitely going to add this in. Thanks again.
stefanrush 11y ago
I added that toggle gzip checkbox. Thanks again for the push.

ohitsdom 11y ago

Didn't look at the source- how are you determining popularity?

stefanrush 11y ago
GitHub stars

codingthebeach 11y ago

Nice! I had fun with this, especially comparing Ember's half a meg footprint to Backbone's 20K. One helpful data point could be whether the library supports a (formal) custom build apparatus, since you can often get a sizable reduction that way. Full jQuery UI clocks in at ~242K, but using http://jqueryui.com/download/ http://jqueryui.com/download/ you can often strip it down to 20K or less. Similarly with THREE.js and several others. Going in the other direction, a library that seems small (Backbone.js, @ ~20K) may actually end up being relatively heavy because of required external dependencies. A more explicit side-by-side "compare" function would also be nice here, comparing library size along with other metrics like script loader compatibility, maintenance frequency, different flavors of popularity, etc.

yoran 11y ago
It's not very fair to compare Ember's size with Backbone's as Backbone implements just a very small subset of Ember's functionality. Also, it seems that the sizes are outdated because the latest build of Ember.js is 478KB (see http://builds.emberjs.com/release/ember.min.js http://builds.emberjs.com/release/ember.min.js).
- stefanrush 11y ago
  Thank you! I was actually unaware that Ember has separate versions for production and dev. I was using the dev version which I assume has extra features for debugging. I just updated it with the correct version. Sorry Ember...
  - yoran 11y ago
    No worries, thanks for correcting!
Nemcue 11y ago
Ember is ~75k gzipped, so that comparison is moot.
stefanrush 11y ago
Thanks for the feedback. Great point on modular libraries. I definitely thought about that during development. I just couldn't find a good way to implement it. Some libraries like Modernizr have billions of possible permutations. I also like the idea of comparing other metrics. Definitely something I'll look at going forward.

lhorie 11y ago

I just tried contributing a library but it's not showing up in the site. No error either.

stefanrush 11y ago
Thank you for contributing! I have approve them before they appear to prevent people from spamming. I just checked and was surprised to see 22 libraries awaiting approval. Awesome feeling. I was not expecting that. I'll be able to go through them tonight. I did just add a flash message users will see after they make a contribution though. Thanks for the feedback. And thanks to everyone who contributed a library.