Meggin Kearney
Flavio Copes
タイムライン イベント モードでは、録画中にトリガーされたすべてのイベントが表示されます。タイムライン イベント リファレンスを使用して、各タイムライン イベントタイプについて確認してください。
タイムライン イベントの一般的なプロパティ
特定の詳細情報はすべてのタイプのイベントに存在しますが、一部の詳細情報は特定のイベントタイプにのみ適用されます。このセクションでは、さまざまなイベントタイプに共通するプロパティについて説明します。特定のイベントタイプに固有のプロパティについては、後述のイベントタイプのリファレンスをご覧ください。
| プロパティ | 表示されるタイミング |
|---|---|
| 合計時間 | ネストされたイベントを含むイベントの場合、イベントの各カテゴリに要した時間。 |
| コールスタック | 子イベントがあるイベントの場合、イベントの各カテゴリに要した時間。 |
| CPU 時間 | 記録されたイベントに費やされた CPU 時間。 |
| 詳細 | イベントに関するその他の詳細。 |
| 所要時間（タイムスタンプ） | イベントとそのすべての子イベントが完了するまでにかかった時間。タイムスタンプは、録画開始からの経過時間で、イベントが発生した時刻です。 |
| セルフ時間 | 子なしでイベントが実行された時間。 |
| 使用済みヒープサイズ | イベントが記録されたときにアプリケーションによって使用されていたメモリの量と、前回のサンプリングからの使用済みヒープサイズの増減（±）。 |
イベントを読み込んでいます
このセクションでは、読み込みカテゴリに属するイベントとそのプロパティの一覧を示します。
| イベント | 説明 |
|---|---|
| HTML の解析 | Chrome が HTML 解析アルゴリズムを実行した。 |
| 読み込みの終了 | ネットワーク リクエストが完了しました。 |
| データの受信 | リクエストのデータが受信されました。1 つ以上の Receive Data イベントがあります。 |
| レスポンスの受信 | リクエストからの最初の HTTP レスポンス。 |
| リクエストを送信 | ネットワーク リクエストが送信されました。 |
イベント プロパティの読み込み
| プロパティ | 説明 |
|---|---|
| リソース | リクエストされたリソースの URL。 |
| プレビュー | リクエストされたリソースのプレビュー（画像のみ）。 |
| リクエスト方法 | リクエストに使用された HTTP メソッド（GET や POST など）。 |
| ステータス コード | HTTP レスポンス コード。 |
| MIME タイプ | リクエストされたリソースの MIME タイプ。 |
| エンコードされたデータの長さ | リクエストされたリソースの長さ（バイト単位）。 |
スクリプト イベント
このセクションでは、スクリプト カテゴリに属するイベントとそのプロパティを示します。
| イベント | 説明 |
|---|---|
| アニメーション フレームの呼び出し | スケジュールされたアニメーション フレームがトリガーされ、そのコールバック ハンドラが呼び出されました。 |
| アニメーション フレームをキャンセル | スケジュールされたアニメーション フレームがキャンセルされました。 |
| GC イベント | ガベージ コレクションが発生しました。 |
| DOMContentLoaded | ブラウザによって DOMContentLoaded がトリガーされました。このイベントは、ページの DOM コンテンツがすべて読み込まれて解析されたときに発生します。 |
| スクリプトの評価 | スクリプトが評価されました。 |
| イベント | JavaScript イベント（「mousedown」や「key」など）。 |
| 関数呼び出し | トップレベルの JavaScript 関数呼び出しが行われた（ブラウザが JavaScript エンジンに入ったときにのみ表示されます）。 |
| タイマーのインストール | setInterval() または setTimeout() でタイマーが作成されている。 |
| アニメーション フレームをリクエスト | requestAnimationFrame() 呼び出しで新しいフレームがスケジュールされた |
| タイマーの削除 | 以前に作成したタイマーが消去された。 |
| Time | console.time() というスクリプト |
| 終了時間 | console.timeEnd() というスクリプト |
| タイマーの呼び出し | setInterval() または setTimeout() でスケジュールされたタイマーが起動した。 |
| XHR 準備完了状態の変更 | XMLHTTPRequest の準備状態が変更された。 |
| XHR 読み込み | XMLHTTPRequest の読み込みが完了しました。 |
スクリプト イベントのプロパティ
| プロパティ | 説明 |
|---|---|
| タイマー ID | タイマー ID。 |
| タイムアウト | タイマーで指定されたタイムアウト。 |
| 繰り返し | タイマーを繰り返すかどうかを指定するブール値。 |
| 関数呼び出し | 呼び出された関数。 |
レンダリング イベント
このセクションでは、レンダリング カテゴリに属するイベントとそのプロパティを示します。
| イベント | 説明 |
|---|---|
| レイアウトを無効にする | DOM の変更によりページ レイアウトが無効になりました。 |
| レイアウト | ページ レイアウトが実行されました。 |
| スタイルの再計算 | Chrome で要素のスタイルが再計算されました。 |
| スクロール | ネストされたビューのコンテンツがスクロールされた。 |
レンダリング イベントのプロパティ
| プロパティ | 説明 |
|---|---|
| レイアウトが無効化された | Layout レコードの場合、レイアウトが無効になった原因となったコードのスタック トレース。 |
| レイアウトが必要なノード | Layout レコードの場合、再レイアウトの開始前にレイアウトが必要とマークされたノードの数。通常、これらはデベロッパー コードによって無効にされたノードと、ルートを再レイアウトするための上位のパスです。 |
| レイアウト ツリーのサイズ | Layout レコードの場合、再レイアウト ルート（Chrome が再レイアウトを開始するノード）の下のノードの合計数。 |
| レイアウト スコープ | 指定可能な値は「部分」（再レイアウト境界は DOM の一部）または「ドキュメント全体」です。 |
| 影響を受ける要素 | スタイル再計算レコードの場合、スタイルの再計算の影響を受ける要素の数。 |
| スタイルが無効化された | スタイルの再計算レコードの場合、スタイルの無効化の原因となったコードのスタック トレースを提供します。 |
絵画イベント
このセクションでは、ペインティング カテゴリに属するイベントとそのプロパティについて説明します。
| イベント | 説明 |
|---|---|
| レイヤの合成 | Chrome のレンダリング エンジンが画像レイヤを合成しました。 |
| 画像のデコード | 画像リソースがデコードされた。 |
| 画像のサイズ変更 | 画像がネイティブ サイズからサイズ変更された。 |
| Paint | 合成されたレイヤがディスプレイの領域にペイントされました。ペイント レコードにカーソルを合わせると、更新されたディスプレイ領域がハイライト表示されます。 |
ペイント イベントのプロパティ
| プロパティ | 説明 |
|---|---|
| 場所 | Paint イベントの場合、ペイント長方形の x 座標と y 座標。 |
| ディメンション | Paint イベントの場合、ペイントされた領域の高さと幅。 |