How important is using tiny variable names in Javascript?

Question

It seems like, for many javascript widgets, the authors have made a conscious effort to use tiny variable names. For example:

// Instead of...
this.mousePositions = new Array();
// they use...
this.mp = new Array();

My question is this: how important is this in terms of reducing overall javascript file request size? I'm working on releasing a javascript widget to the public, which, after being minified, is about 2.8KB. However, because the main advantage of this plugin is how lightweight it is, does anyone have experience with whether it's worth it to go through and switch out all of the sensical variable names that I used with these new, tiny variable names? It just seems like the code is so much less readable that way and it's going to be much harder to maintain.

Thanks for your help!

Charlie

Answer 1

Many times, the author will write the longer form, for readability, and then have a program like Google's Closure Compiler, or YUI Compressor to shorten it, for faster transfer to the client.

Answer 2

How important? not really unless they're used all over the place, delivering your scripts via gzip compression negates most of the name byte-cost there.

But why not have the best of both words? Use descriptive names when developing (why punish yourself?), then minify your scripts as part of the build process to get small compact names for production code, and a minimal-size transfer to the user.

Answer 3

It shouldn't matter at all. Really, the only advantage is to prevent people from knowing how your code works. If it's okay with you for it to be readable then the size of the variable names is irrelevant. IMO.

Answer 4

A good minifier will shorten variable names. You should keep a readable copy of the source code with good variable names and white space. Then you should minify it for use on production. The original copy will be used for further development and debugging. You should use a good naming scheme for this process. Example: Create my_program_v1.js then run it through a minifier like Google's Closure compiler and name the result my_program_v1.min.js and serve that version on the Web.

Answer 5

You could develop your scripts using the longer, more descriptive names for your variables and then minify your script file for production release. This way you have something very readable for development and something small (relatively) and compressed to send to the clients.

There are a lot of minification tools out there.

http://stackoverflow.com/questions/841253/javascript-good-tool-to-minify-jquery-based-js-files