Regarding "Dynamic Source Maps"

January 22nd, 2013

Peter van der Zee recently wrote about source maps; in particular, he detailed the ways that he has found them lacking and proposes changes to the source map spec that he believes would improve them to support his use cases.

What Peter wants is to generate and consume source maps at runtime in the browser, and develop without an extra compilation and refresh step. When you are editing and compiling sources inside of the browser, rather than sources on a file server, you can't point to a remote URL where the original source (the source before the compilation step) is located. This is problematic because source URLs are exactly what source maps require, as defined by the spec.

Peter then outlines proposed changes to the source map spec to support his need for "dynamic" source maps. First, adding a new comment pragma //@ sourceMapping=<source map JSON blob>. Second, to include the full original source(s) inside the source map rather than including URLs pointing to the location of the original source(s).

Peter is a very intelligent person, and I have been following his blog for more than two years (you should follow, too), but I believe that he jumped the gun by leaping from his use cases to proposing changes to the source map spec. The one doesn't lead to the other because his use case is already supported by the current specification as-is.

How? Data URLs. Encode the original source(s) as data URLs in the source map's sources list, and encode the whole source map as a data URL in the //@ sourceMappingURL comment pragma appended to the generated source. By doing this, both the whole source map and complete original source(s) are attached directly to the generated source. This accomplishes the same goals that Peter's solution does: you can dynamically generate source maps inside your browser environment (presumably with the mozilla/source-map library) and all of the resources can exist inside your development environment instead of on a remote server.

The benefits to using data URLs are:

If I have overlooked any facet of Peter's use cases that isn't supported by using data URLs, I would love to know in the comments.

« Previous Entry

Next Entry »

Recent Entries

Back to the Futu-rr-e: Deterministic Debugging with rr on November 2nd, 2015

Proposal for Encoding Source-Level Environment Information Within Source Maps on July 22nd, 2015

Source Maps are an Insufficient Debugging Format for the Web on June 19th, 2015

A Compact Representation of Captured Stack Frames for SpiderMonkey on April 10th, 2015

Memory Management in Oxischeme on February 22nd, 2015

Naming `eval` Scripts with the `//# sourceURL` Directive on December 5th, 2014

wu.js 2.0 on August 7th, 2014

Come work with me on Firefox Developer Tools on July 8th, 2014

Debugging Web Performance with Firefox DevTools - Velocity 2014 on June 26th, 2014

Beyond Source Maps on March 12th, 2014

Creative Commons License