4 ms·

> It seems like many of the variables are given names that are not descriptive at all to make it a bit more difficult to read. The code is just minimized for p

> It seems like many of the variables are given names that are not descriptive at all to make it a bit more difficult to read. The code is just minimized for prod.. The article as written makes it sound like the developer(s) intentionally wrote their code cryptically, whereas minimization for deployment is fairly standard practice

tyingq 5y ago
How common is it to have your minifier change symbol/variable names to short ones?
- nilsbunger 5y ago
  Very common
- spdustin 5y ago
  Closure Compiler (for JavaScript) does it. With the SIMPLE_OPTIMIZATIONS [0] flag, it will rename parameters for—and variables local to—functions to save space. [0]: https://developers.google.com/closure/compiler/docs/compilation_levels#simple_optimizations https://developers.google.com/closure/compiler/docs/compilat...
- VoidWhisperer 5y ago
  It is pretty common. The goal of the minifier is to reduce the size of the file, so taking the function names, variable names, etc and making them as short as possible works towardd that goal
- joek1301 5y ago
  I just popped open DevTools on an SPA I made using create-react-app with default settings. Sure enough the minified production JavaScript uses shortened variable names. This is default configuration for Webpack, which is pretty widely used throughout (and outside) the React ecosystem. Interestingly you can still view the unminified source, since create-react-app generates source maps by default.
- deergomoo 5y ago
  Pretty much all of them do it. You can’t minify keywords or literals, so that just leaves whitespace, which would be barely any minification at all.
  - tyingq 5y ago
    Jsmin cited a typical 50% reduction without touching symbols, though perhaps that's an average that included removing comments.
- 0xfeba 5y ago
  That's literally what they are for.
  - tyingq 5y ago
    For some context, it didn't used to be terribly common. There's a fair amount of minifying that you can do without touching symbol names, though obviously it doesn't help as much as shortening them. The old jsmin cited about 50% reduction, and it didn't touch any variable or class names.
- k3liutZu 5y ago
  It's actually pretty standard
- kbelder 5y ago
  I've seen some minifiers that can restructure your code... replace if{} with a ternary ?: operator or use boolean shortcutting to replace the whole conditional with a ||, and so on. It's supposed to never do anything that actually affects the logic, but that sort of stuff scares me.
jer0me 5y ago
If they really wanted to hide it, there are some nasty obfuscators for JavaScript: https://obfuscator.io/ https://obfuscator.io/
- HmOh6WbJ 5y ago
  https://jsfuck.com https://jsfuck.com is another good one

tyingq 5y ago

How common is it to have your minifier change symbol/variable names to short ones?

nilsbunger 5y ago
Very common
spdustin 5y ago
Closure Compiler (for JavaScript) does it. With the SIMPLE_OPTIMIZATIONS [0] flag, it will rename parameters for—and variables local to—functions to save space. [0]: https://developers.google.com/closure/compiler/docs/compilation_levels#simple_optimizations https://developers.google.com/closure/compiler/docs/compilat...
VoidWhisperer 5y ago
It is pretty common. The goal of the minifier is to reduce the size of the file, so taking the function names, variable names, etc and making them as short as possible works towardd that goal
joek1301 5y ago
I just popped open DevTools on an SPA I made using create-react-app with default settings. Sure enough the minified production JavaScript uses shortened variable names. This is default configuration for Webpack, which is pretty widely used throughout (and outside) the React ecosystem. Interestingly you can still view the unminified source, since create-react-app generates source maps by default.
deergomoo 5y ago
Pretty much all of them do it. You can’t minify keywords or literals, so that just leaves whitespace, which would be barely any minification at all.
- tyingq 5y ago
  Jsmin cited a typical 50% reduction without touching symbols, though perhaps that's an average that included removing comments.
0xfeba 5y ago
That's literally what they are for.
- tyingq 5y ago
  For some context, it didn't used to be terribly common. There's a fair amount of minifying that you can do without touching symbol names, though obviously it doesn't help as much as shortening them. The old jsmin cited about 50% reduction, and it didn't touch any variable or class names.
k3liutZu 5y ago
It's actually pretty standard
kbelder 5y ago
I've seen some minifiers that can restructure your code... replace if{} with a ternary ?: operator or use boolean shortcutting to replace the whole conditional with a ||, and so on. It's supposed to never do anything that actually affects the logic, but that sort of stuff scares me.

jer0me 5y ago

If they really wanted to hide it, there are some nasty obfuscators for JavaScript: https://obfuscator.io/ https://obfuscator.io/

HmOh6WbJ 5y ago
https://jsfuck.com https://jsfuck.com is another good one