9 ms·

Introduction to JavaScript source maps

79 points by eskimoblood 15y ago

jeremyis 15y ago
This is awesome. Didn't see a mention of node anywhere... Once Chrome supports this, anyone have an idea how difficult NodeJS integration will be? Am particularly interested in Coffee w/ NodeJS :)
famoreira 15y ago
Anyone know the state of source map support for CofeeScript?
- quadhome 15y ago
  https://github.com/fitzgen/coffee-script/tree/source-maps https://github.com/fitzgen/coffee-script/tree/source-maps
  - mnemonik 15y ago
    This specific fork is not the one that is going to eventually be merged in to CoffeeScript. Follow the (very large) issue here: https://github.com/jashkenas/coffee-script/issues/558 https://github.com/jashkenas/coffee-script/issues/558
- jashkenas 15y ago
  There are a couple of existing forks / patches / pull requests with preliminary support for it. Given that its presence in Chromium means it'll probably land in Chrome proper in the next couple of months, we should try to merge and finish support for source maps before then.
quadhome 15y ago
wrt. Base64 VLQ: source maps are text and compressible via gzip. Anyone know if there are any links to discussion about the trade-off made making the more complex and less human accessible?
- quadhome 15y ago
  To answer my own question, VLQ coding is used in other debugging symbol formats for the same reason.
- kevingadd 15y ago
  Having to go to the trouble of understanding and implementing Base64 VLQ (since basically nobody uses it) myself just to prototype a source map implementation for my compiler makes me less likely to actually get around to it, because it's one more complete unknown in a format that seems to have almost nothing resembling working deployments or documentation to speak of. It really sucks that the best source of information on 'how to create source maps' is the closure compiler source and not an actual spec or documentation (I searched around and the closest thing to docs I could find was an extremely concise Google Doc with gaps in it that may not match what is deployed in Chrome [1]). Being told 'just do what these guys do' is not a great way to get a new standard implemented on the web, especially when 'these guys' is Chrome Canary talking to a Google compiler. Has anyone run across better documentation that clearly describes the file format, or a second implementation I can use to check that my source maps are correct? The only other choice I've run across is a (seemingly dead) Firefox 3.x addon that adds support for some reason of the source map format, specifically for supporting Closure Compiler. [2] [1]: https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k/edit?pli=1 https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiO... [2]: https://developers.google.com/closure/compiler/docs/inspector https://developers.google.com/closure/compiler/docs/inspecto...
  - paulirish 15y ago
    From what I've heard, the Mozilla source-map repo is your best bet on "how to create source maps": https://github.com/mozilla/source-map https://github.com/mozilla/source-map It's what Traceur (Google's ES6/ES.Next transpiler) uses under the hood.
jqueryin 15y ago
Pretty exciting stuff here. There's nothing worse than trying to debug when a call is made to a minified version of a plugin and your console is puking up a wrapped one-liner chock full of single char variable names (or worse, evals).
jeremi23 15y ago
Would it be possible to support this in tools like errbit that report js error in production as well ? It would make it easier to have full stacktrace with meaningful names.

79 points by eskimoblood 15y ago

This is awesome. Didn't see a mention of node anywhere... Once Chrome supports this, anyone have an idea how difficult NodeJS integration will be? Am particularly interested in Coffee w/ NodeJS :)

famoreira 15y ago

Anyone know the state of source map support for CofeeScript?

quadhome 15y ago
https://github.com/fitzgen/coffee-script/tree/source-maps https://github.com/fitzgen/coffee-script/tree/source-maps
- mnemonik 15y ago
  This specific fork is not the one that is going to eventually be merged in to CoffeeScript. Follow the (very large) issue here: https://github.com/jashkenas/coffee-script/issues/558 https://github.com/jashkenas/coffee-script/issues/558
jashkenas 15y ago
There are a couple of existing forks / patches / pull requests with preliminary support for it. Given that its presence in Chromium means it'll probably land in Chrome proper in the next couple of months, we should try to merge and finish support for source maps before then.

quadhome 15y ago

wrt. Base64 VLQ: source maps are text and compressible via gzip. Anyone know if there are any links to discussion about the trade-off made making the more complex and less human accessible?

quadhome 15y ago
To answer my own question, VLQ coding is used in other debugging symbol formats for the same reason.
kevingadd 15y ago
Having to go to the trouble of understanding and implementing Base64 VLQ (since basically nobody uses it) myself just to prototype a source map implementation for my compiler makes me less likely to actually get around to it, because it's one more complete unknown in a format that seems to have almost nothing resembling working deployments or documentation to speak of. It really sucks that the best source of information on 'how to create source maps' is the closure compiler source and not an actual spec or documentation (I searched around and the closest thing to docs I could find was an extremely concise Google Doc with gaps in it that may not match what is deployed in Chrome [1]). Being told 'just do what these guys do' is not a great way to get a new standard implemented on the web, especially when 'these guys' is Chrome Canary talking to a Google compiler. Has anyone run across better documentation that clearly describes the file format, or a second implementation I can use to check that my source maps are correct? The only other choice I've run across is a (seemingly dead) Firefox 3.x addon that adds support for some reason of the source map format, specifically for supporting Closure Compiler. [2] [1]: https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k/edit?pli=1 https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiO... [2]: https://developers.google.com/closure/compiler/docs/inspector https://developers.google.com/closure/compiler/docs/inspecto...
- paulirish 15y ago
  From what I've heard, the Mozilla source-map repo is your best bet on "how to create source maps": https://github.com/mozilla/source-map https://github.com/mozilla/source-map It's what Traceur (Google's ES6/ES.Next transpiler) uses under the hood.

jqueryin 15y ago

Pretty exciting stuff here. There's nothing worse than trying to debug when a call is made to a minified version of a plugin and your console is puking up a wrapped one-liner chock full of single char variable names (or worse, evals).

jeremi23 15y ago

Would it be possible to support this in tools like errbit that report js error in production as well ? It would make it easier to have full stacktrace with meaningful names.