Kanon - プログラミングコードを可視化 // MOONGIFT Archived

プログラミングは構造的です。そのため、構文解析して別な言語にしたり、ツリー構造に展開したりできます。それらの構造を見ることで、綺麗な設計になっているかどうかも分かりそうです。そんな可能性を感じさせるのがKanonです。JavaScriptのコードを解析、ビジュアル化します。

Kanonの使い方

左側にコード、右上にクラスの構造、右下にメインスクリプトの実行が可視化されています。

処理を増やしたところ。

コードが複雑になると、可視化された構造も複雑化します。

Kanonを使うことでプログラミングコードを別な視点から見られるようになります。コードは自動的に更新されるので、自分のコードを貼り付けてみて、どんな構造になっているのか見てみるのも面白そうです。

KanonはJavaScript製のオープンソース・ソフトウェア（MIT License）です。