Javascript Source Maps

I saw in Chrome’s Network tab that I was downloading a file named “jquery.min.map”. It turns out it’s a sourcemap that has debugging info for the minified code. The jQuery 1.9 RC1 release notes explain sourcemaps:

What’s all this about? Well imagine that you are using compressed versions of your files on your production site, including a compressed version of jQuery. You get a report that an important customer is running into a problem. You could debug it a lot easier if you had the uncompressed source, but using that on your high-traffic production site isn’t an option. With source maps, you can let the browser’s debugger “map” the lines in the compressed file into the uncompressed source. That makes it so much easier to set breakpoints, inspect or change values, and see meaningful variable names.

Advertisements