search

samccone / The-cost-of-transpiling-es2015-in-2016

Investigating the overhead cost of compiled es2015
1.34k stars 37 forks source link

use --mangle option with uglifyjs #17

Closed Rich-Harris closed 8 years ago

Rich-Harris commented 8 years ago

Thanks for doing this awesome research!

I was surprised to see Webpack beating Rollup, so I poked around a bit – it seems that while the Webpack example is using UglifyJsPlugin, which mangles variable names, the npm run compile scripts don't use the --mangle option.

With --mangle, I get different results for make size:

example without mangle with mangle gzip without mangle gzip with mangle
babel 20366 14328 4770 3884
babelify 20366 14328 4770 3884
rollup 15213 11281 4175 3398
rollup-plugin-babel 15365 11308 4130 3407
traceur 98117 68879 22357 18112
typescript 19455 13811 5379 4424

So Rollup now beats Webpack (3737).

Obviously this is just sour grapes on my part (I created Rollup) but I do think it's a fairer comparison :grinning:

samccone commented 8 years ago

This is real nice :sunglasses: :+1:

I will land this commit with the other outstanding PRs tonight and update all of the graphs

samccone commented 8 years ago

so @Rich-Harris I was slightly suspicious of this fix.. given what happened in closure compiler when I tried a similar optimization

screen shot 2016-02-02 at 5 54 28 pm

The mangled names cause the code to no longer function for all of the examples.

samccone commented 8 years ago

(going to investigate the src code changes needed to enable this kind of mangling so no action needed just yet)

kzc commented 8 years ago

Noticed in the various package.json files that you're using an old version of uglifyjs:

    "uglifyjs": "^2.4.10"

The latest version is:

    "uglifyjs": "^2.6.1"

That may resolve your mangle issue.

kzc commented 8 years ago

I am unable to reproduce the error reported in https://github.com/samccone/The-cost-of-transpiling-es2015-in-2016/pull/17#issuecomment-178955003 with mangle enabled on rollup, webkit and babel. Tested on Chrome and Safari. The Todo app works fine and no errors in javascript console other than Chrome can't find favicon.ico.

samccone commented 8 years ago

manually landed woohoo!

Rich-Harris commented 8 years ago

:+1:

samccone commented 8 years ago

@Rich-Harris you can track the progress as I land everything here https://github.com/samccone/The-cost-of-transpiling-es2015-in-2016/tree/mangle#raw-data