メインコンテンツまでスキップ

実行時コール統計

DevToolsのパフォーマンスパネル は、さまざまなChrome内部メトリクスを可視化することで、ウェブアプリの実行時のパフォーマンスについての洞察を提供します。ただし、特定の低レベルのV8メトリクスは現在DevToolsでは公開されていません。この文書では、chrome://tracing を使用して、Runtime Call Stats (RCS) として知られる詳細なV8内部メトリクスを収集する最も確実な方法について説明します。

トレースはブラウザ全体(他のタブ、ウィンドウ、拡張機能を含む)の動作を記録するため、クリーンなユーザープロファイルで拡張機能を無効にし、他のブラウザタブを開かない状態で実行するのが最適です:

# クリーンなユーザープロファイルと拡張機能を無効にして新しいChromeブラウザセッションを開始
google-chrome --user-data-dir="$(mktemp -d)" --disable-extensions

最初のタブで測定したいページのURLを入力しますが、まだページを読み込まないでください。

2番目のタブを追加してchrome://tracingを開きます。ヒント: スラッシュなしでchrome:tracingと入力しても構いません。

「Record」ボタンをクリックしてトレースの記録を準備します。まず「Web開発者」を選択し、その後「カテゴリを編集」を選択します。

リストからv8.runtime_statsを選択します。調査の詳細さに応じて、他のカテゴリを選択することもできます。

「Record」を押して最初のタブに戻り、ページを読み込みます。最速の方法は、Ctrl/+1 を使用して最初のタブに直接ジャンプし、Enter を押して入力したURLを承認することです。

ページの読み込みが完了するかバッファが一杯になるまで待ってから、「停止」ボタンをクリックして記録を終了します。

記録されたタブのウェブページタイトルを含む「Renderer」セクションを探します。これを最も簡単に見つける方法は、「プロセス」をクリックし、その後「None」をクリックしてすべてのエントリのチェックを外し、その後興味のあるレンダラのみを選択することです。

Shift を押しながらドラッグしてトレースイベント/スライスを選択します。CrRendererMainThreadPoolForegroundWorkerを含むすべてのセクションを確実にカバーしてください。選択されたすべてのスライスを含むテーブルが下部に表示されます。

テーブルの右上までスクロールして「Runtime call stats table」の横にあるリンクをクリックします。

表示されたビューで下までスクロールすると、V8が時間を費やしている詳細な表が表示されます。

カテゴリを開くことでさらにデータを深く調べることができます。

コマンドラインインターフェース

d8--runtime-call-stats と共に実行して、コマンドラインからRCSメトリクスを取得します:

d8 --runtime-call-stats foo.js