Extension:Popups/Minifying assets with uglifyjs
In commit 7bd29bb we enabled minifying the popups sources with UglifyJS after some research. Here are the tests we performed that lead to enable it.
Method
editSize comparison between minification performed by ResourceLoader & JSMin and UglifyJS via webpack.
Size comparison between minification performed by resource loader using uglify JS and using Node's uglify js via webpack.
- Sources: Popups at commit 6713abb
- Compiled files:
- ResourceLoader minified
- Run
webpack
- Remove
/*@nomin*/
in the first line - Fetch http://localhost:8080/w/load.php?lang=en&modules=ext.popups&only=scripts&skin=vector.
- Run
- Webpack+UglifyJS minified:
- Run
npm run build
- Fetch http://localhost:8080/w/load.php?lang=en&modules=ext.popups&only=scripts&skin=vector
- Run
- ResourceLoader minified
Results
editFile | Bytes | Bytes % | Gzip -9 | Gzip Bytes % |
---|---|---|---|---|
ResourceLoader minified | 57950 | 100% | 14644 | 100% |
Node uglify-js 2.3.6 minified | 33711 | 58.17% (41.83% smaller) | 10821 | 73.89% (26.11% smaller) |
Conclusion
editNode's uglify produces ~40% smaller code, still being ~25% smaller after gzip.
Upon inspection on the compiled files, main reason seems to be because of mangling being enabled on the node version, as it seems to be safe now (in the past it was considered unsafe and not recommended, now only property mangling is considered unsafe and disabled by default).