Chromeのデベロッパーツールで実行中の関数オブジェクトのメモリ使用量を確認できる?　#chrome　#Javascript　#programming #JavaScript

本内容を利用した場合の一切の責任を私は負いません。

先に結論を書くと、自分はできなかった(^^;
下記は悪あがきです(笑)

Chromeバージョン:バージョン: 89.0.4389.114（Official Build）（64 ビット）

スコープ内に定義された関数オブジェクトの実行中のメモリ使用量を知りたかった。
ソースは下記で、innerFunctionオブジェクトについて。
できれば、その関数を実行中である時と実行中でない時のそれぞれについて。
(どうでもいいことだが、「a1G」は最初は「1000 * 1000 * 1000」だったから。
実行するとデカ過ぎてJavascriptがOut of memoryでエラる(笑))

<html>

<head>
    <script>
        function button1Handler()
        {
            innerFunction();

            function innerFunction(params)
            {
                let a1G = new Array(100 * 1000 * 1000);

                for (let index = 0; index < a1G.length; index++)
                {
                    a1G[index] = index;
                }

                alert("innerFunction start memory-snap");
                alert("innerFunction end memory-snap");
            }
        }

        function button2Handler(params)
        {
            alert("button2Handler start memory-snap");
            alert("button2Handler end memory-snap");
        }
    </script>
</head>

<body>
    <form action="">
        <input type="button" value="button1" onclick="button1Handler();">
        <input type="button" value="button2" onclick="button2Handler();">
    </form>
</body>

</html>

Chromeのデベロッパーツールに下記のようなMemoryタブがある。

単にChromeで表示している状態でスナップをとると、下記のようにオブジェクトのメモリ使用量らしきものが表示される。
一番したの検索窓っぽいものは、Ctrl+fを押すと表示されます。

ということで、「innerFunction start memory-snap」のダイアログが表示されている時にスナップを撮ってみたのが下記。

左の「HEAP SNAPSHOTS」のとこが「Snapshotting...」になってる。
これ、ずっとこのままorz
ダイアログのOKを押し、すぐ次に表示される「innerFunction end memory-snap」のダイアログでOKを押した後にやっと完了する。
完了した時のスナップの内容は最初と大差なく、実行中のスナップではないっぽい。
おそらく、Javascriptを実行中はスナップをとれないんじゃないかと思われる。
これじゃ欲しい情報はとれない。
ちなみに、最初の画面で、2つ目のラジオボタンの「～timeline」にするとモニタリングできる。
それでとったものだと「innerFunction」は出てくるけど、それでもバカデカいはずのa1Gが加味されたようなサイズではなく、それも欲しい情報とは違うっぽい。
一応、実行中ではなく、かつ、グローバル等常に存在するものを対象とするなら、「Chrome デベロッパーツール　memoryタブ　スナップ」で検索するといろいろ情報があります。

ちなみに、今更だとは思うけど、Javascript全体ならChromeが持っているタスクマネージャで確認することはできる。
ボタンを押す前が下記。

ボタンを押し、全てのダイアログでOKを押し、ハンドラから復帰した時点が下記。

1、2分経った後が下記。

解放に時間差があるので、ガベージコレクション(以降、GC)みたいなメモリ管理をしているのかも。
とはいえこれも、復帰後にバカデカくなったから、実行中を積み上げたものではなく、GCも含めたメモリ使用量を表示してるだけかも。
意外にも、ページの動作とChrome自身の動作は同一スレッドか同一イベントハンドリング下で、ページの動作中はスナップ等Chrome自身の動作も停まっちゃうのか？？？

Chromeのデベロッパーツールで実行中の関数オブジェクトのメモリ使用量を確認できる? #chrome #Javascript #programming

Chromeのデベロッパーツールで実行中の関数オブジェクトのメモリ使用量を確認できる?　#chrome　#Javascript　#programming