source-mapを可視化する - Islands in the byte stream (legacy)source-mapは非常に期待のできる技術だが、軽く仕様を読んでもどのように動くのかよくわからない。そこで、souce-mapを可視化するツールを作ってみた。source-mapの処理にはmozillaのJavaScriptによる実装を使った。 左がオリジナルのソースコード、右がclosure compilerで最適化したコードである。具体的なコマンドラインオプションは以下のrepositoryのMakefile参照のこと。要素から要素への線はcanvasを利用した。ChromeとFirefoxでのみ確認したので、他のブラウザではうまく表示できないかもしれない。 demo repository 改良の余地はあるものの、とりあえずこれでデバッグできるようになった。
