エンターテイメント!!

遊戯王好きのJavaエンジニアのブログ。バーニングソウルを会得する特訓中。

【翻訳】JavaScript Visualizer

経緯

目に止まって、内容見たら、新しい発見があったので、残す

元記事

JavaScript Visualizer - DEV Community

翻訳

DeepL翻訳より

もしあなたがJavaScriptがどのように動作するかに興味があるなら、私はこのオンラインJavaScriptツールをお勧めします、それは実行時のすべてのステップを視覚化します
このサイトの定義済みプリセットを読み込むだけで、または自分のコードをコピー&ペーストして、実行のステップを見ることができます 。
それは完全に無料です。以下をクリックして試してみてください。

感想・雑記など

リンク先のやつは、jsのプロセスの実行内容が、ビジュアライズされたツールのようだった。
開発で利用してるソースを貼るのは無理だが、ローカルでも動かせるっぽいので、準備できればローカルでも使えそう。

サンプル試していて気づいたのは、setTimeoutの実行タイミングが、思ってたのと違った。
promiseのやつもだけど。
setTimeoutは、一連の処理が終わった後にタスクが組まれるという事実を、初めて知った。
なんとなく、該当行を実行したときに、時間の計測が始まるのだと思っていたが、違うらしい。。。

jsの非同期系の処理は、あらためて、鬼門だと思いました。

実行タイミングに引っかかったら、これを使ってみるのもありかもしれない。