メモリパネルの概要

Dale St. Marthe
Dale St. Marthe

[メモリ] パネルには、JavaScript オブジェクトのメモリ分布の確認、メモリリークの検出と分離、関数ごとのメモリ割り当ての内訳の取得などを行う診断ツールが用意されています。

概要

[メモリ] パネルでは、4 種類のプロファイルをキャプチャできます。次のプロファイル タイプは、さまざまな視点からのスナップショットを表示し、さまざまな有用性を提供します。

  • ヒープ スナップショット: ページの JavaScript オブジェクトと関連する DOM ノードのメモリ分布が表示されます。
  • タイムラインの計測手法割り当て: 計測された JavaScript メモリ割り当ての推移が表示されます。プロファイルの録画後に時間間隔を選択して、プロファイル内に割り当てられ、録画が終了するまでに継続しているオブジェクトを表示できます。このプロファイルを使用して、メモリリークを隔離します。
  • 割り当てサンプリング: サンプリング方法を使用してメモリ割り当てを記録します。このタイプのプロファイルは、パフォーマンスのオーバーヘッドが最も低く、長時間実行オペレーションに使用できます。JavaScript 実行スタックごとに分類された割り当てのおおよその値がわかります。
  • デタッチされた要素: JavaScript 参照によって保持されたオブジェクトが表示されます。

これらのプロファイルを実行する JavaScript VM インスタンスを選択できます。

詳しくは、次をご覧ください。

[Memory] パネルを開く

[メモリ] パネルを開くには:

  1. DevTools を開きます
  2. 次のコマンドを実行して、コマンド メニューを開きます。
    • macOS: Command+Shift+P
    • Windows、Linux、ChromeOS: Ctrl+Shift+P コマンド メニュー
  3. memory」と入力し、[メモリを表示] を選択して、Enter キーを押します。DevTools ウィンドウの上部に [メモリ] パネルが表示されます。

または、次の方法で [メモリ] パネルを開くこともできます。

  • 上部のアクションバーで、 [その他のパネル] をクリックし、プルダウン リストから [メモリ] を選択します。
  • 右上の [その他] > [その他のツール] > [メモリ] を選択します。