Making tiny things big - no, not Viagra

Today I got an email from a friend who was taking over a web site from someone else. Apparently he hadn't been given all the original files and is picking up based on what exists on the web server. He was contacting me because there was a JS file which was formatted to all be on one line. He was looking for a way to reformat the file to something he could read.

This is one of those rare occasions when I'm actually able to help someone.

One of the things I've learned since starting at the current gig has been the importance of minifying (sometimes called "packing") the CSS and JS files our application delivers to the browser. If you're not familiar with minifying CSS and JS files, it's when you take your file which is formatted nicely for humans with stuff like comments, indentation, vertical white space, meaningful variable names and etc. and you run it through a program that removes all the stuff that humans like, but which the browser doesn't need. By removing all that stuff, the file can be made significantly smaller - which reduces download time and improves the performance of the web site.

The file he was dealing with had clearly been run through a minifier. The trick now would be to unminify the file. I've never had to do that because we're always starting with the source code. But a quick search on Google lead me to http://jsbeautifier.org/. The tool on this site can reintroduce white-space, such as vertical white-space and indentation, to make the code easier on the eyes. Obviously, it cannot restore comments or meaningful variable names, but if you're going to have to dig in and figure out the code it's a good way to start.