Ask HN: Do you recommend compressing js files to remove extra whitespace? | Hacker News Reader

Ask HN: Do you recommend compressing js files to remove extra whitespace?

I feel like I am using a lot of javascript on my new project and I am wondering if it's a good idea to run my JS files through a service like 'jscompress.com' to speed up execution time. These compression services mostly strip out "extra whitespace" and "comments" to speed up execution times, but compressing makes the file look messy.

These online compression services allow you to do a couple of things, but I am not sure which is more beneficial (if at all).

Option #1: Upload and combine js files to consolidate and compress.

Option #2: Just compress files keeping them separate.

If anyone has a recommendation please share. Thanks fellow hackers.

View on HN

I'm curious why there is a problem with making "the file look messy?" Your users will likely never look at it (unless you are building something for JS developers) and the compression should really only be a step in your deploy (save, compress, run tests, deploy to server). So theoretically no one should ever look at the compressed files. That being said if you have a lot of JS it can really improve load times of sites but thats about it.

As for the 2 options you listed, there are 2 benefits of option 1 over 2 (given that no one is ever going to look at the compressed files). First, some JS compressors do a better job when they have all the files together as one large file. Second, consolidating them all down to 1 file significantly decreases the number of requests the client has to make to your server. This reason alone will probably have a bigger impact on your sites performance than compressing the files alone so I would definitely recommend you look into it.

Well "messy" makes it harder for me to read and I prefer neat code. Do you have any recommendations on sites that compress js files? I've noticed several sites, but not sure if one is better than another. Thank you for your input. It is appreciated.

As pilom mentioned, no one will be reading your compressed (also known as "minified") code. Your day-to-day programming will be in a non-compressed form of JS. When your code is release-ready, you go through the aforementioned deployment process.

I tend to use YUIcompressor, but I don't think any of them differ much.

thank you.

Stripping out comments and whitespace is unlikely to speed up execution (technically, I suppose it will speed up parsing, but I wouldn't have thought skipping comments and whitespace makes up a noticeable portion of the runtime of most scripts). It will probably speed up download time, although the savings might not be as large as you would expect because JavaScript can and should be compressed by the server using gzip. Most authorities on making pages load faster seem to recommend minifying JavaScript and combining files where possible.

Consolidating the files reduces the number of HTTP requests the browser has to make, which can make the page load faster because each request has some overhead. On the other hand, JavaScript libraries can be loaded from a CDN like http://code.google.com/apis/libraries/ , and if you do that users may already have a copy in their cache, whereas if you load one combined script including a library and your own code from your own site, users won't get that caching benefit.

Finally, debugging minified JavaScript is a serious pain, so don't minify any JavaScript in active development, just when you are ready to move to production.

Is there a particular performance issue that has lead you to ask this question?

It's generally good practice to consolidate and minify your js files, but don't waste time planning how you do that during your development phases.

The reason I ask if you are having performance problems or page loading performance problems is that generally people get hung up this, and often the code files are the least of your worries. Badly created images and many of them can be a killer - try to look at what you can do here first.

I'd use something like Grunt (https://github.com/cowboy/grunt) as a way to minify & concatenate your files for deployment.

That way, you can work with a file formatted to your liking, but when deployed, it will be optimized.

With or without whitespace - after gzip the difference is only about 1% or so. Bundle your js files together. Place script tag in the end of your html doc to allow parallel downloads.

Yes. Who cares if your file looks "messy"? When you are delivering any content to users, it should be as minimal as possible. You, as the developer, aren't reading the compressed files. They should be compressed automatically as part of your deployment cycle. If you don't have this automated, then include it in your manual process. Develop normally locally, but before you push stuff out run it through a compressor.

Also, I recommend the Google Closure compiler instead of jscompress. Just leave it set at simple unless you are explicitly using Closure. http://closure-compiler.appspot.com/home

thank you

Reply on news.ycombinator.com