
Which tech.stack to use to minimize js code size - kirilloid
TL;DR: I want to reduce resulting JavaScript code size by mangling privates — what technology stack to use?<p>Infrastructure for building a front-end project consists of a lot of parts, but I&#x27;d like to focus on bundling &amp; code size. I&#x27;m obsessed with code size optimizations, but I still want to have a nicely organized modular code.<p>Mainstream tools like WebPack do a great job eliminating dead code, but I want more. Keeping that, I want to reduce the code size further by employing two more techniques. Both of them require an introduction of &quot;packages&quot;. JavaScript doesn&#x27;t have packages^1 at the language level, but the code could be organized into blocks.<p>1. Mangling private properties and whole &quot;private&quot; classes.
2. Inlining declarations of private modules. With small modules, a percentage of module declarations overhead with all its imports and exports is significant.<p>The former is at least partially (properties) available in google closure compiler.
The latter is possible with prepack.io.<p>These are just two examples and actually, possibilities are much broader. But not stack is easy to combine. For example, I already had had hard times combining prepack with fuse-box.<p>I&#x27;m actually open to considering almost any compile-to-js language, both mainstream like TypeScript and less so, like Purescript. But they&#x27;d better have minimalistic (~10kB) runtimes. So Scala.js and GHCJS are not the best options.<p>To give a little more perspective here are examples of build-stacks, I&#x27;m looking for.
Possible options are like
- handwritten es6 | google-closure-compiler | prepack
- TypeScript | tsicle | google-closure-compiler | prepack
- TypeScript -m amd | prepack
- ClosureScript<p>Apart from bare stack descriptions, it&#x27;d be nice to hear details as well: main pain points, what was the actual code reduction (even rough and empirical).<p>^1 — Just to be sure: I&#x27;m not talking about npm packages, but rather something like Java packages.
======
kirilloid
It seems, that TypeScript with google-closure-compiler is a decent enough
approach. [https://github.com/angular/closure-
demo](https://github.com/angular/closure-demo)

