ダッシュボードで主要な指標を追跡する
主要な指標をダッシュボードに追加して、それらの傾向を確認します。週ごとの変更を確認するか、コードの最近の変更によってパフォーマンスが向上していることを確認することで、リグレッションをすばやく特定できます。

追跡できるトレンドの例を次に示します。
- アプリが特定のJavaScriptファイルをロードするときに変更したため、最初の入力遅延が改善されました
- アセットにCDNを使用するように切り替えた後の最初の満足のいくペイントの時間の短縮
- サムネイルの使用を実装したため、ネットワーク要求の応答ペイロードサイズが減少しました
- エコシステム停止中のサードパーティAPI呼び出しのネットワーク応答時間の増加
Firebaseプロジェクトの各メンバーは、独自のダッシュボードを設定できます。他のプロジェクトメンバーが自分のダッシュボードで完全に異なる主要なメトリックのセットを追跡している間、あなたはあなたにとって重要なメトリックを追跡することができます。
ダッシュボードに指標を追加するには、Firebaseコンソールの[パフォーマンス]ダッシュボードに移動し、[ダッシュボード]タブをクリックします。空のメトリックカードをクリックしてから、ダッシュボードに追加する既存のメトリックを選択します。メトリックの置換や削除などのオプションについては、入力されたメトリックカードの をクリックしてください。
ダッシュボードには、収集されたメトリックデータが、グラフ形式と数値のパーセンテージ変化の両方で表示されます。
- 各メトリックカードには、選択した時間範囲でのメトリックの値の変化率と、メトリックの最後に収集された値が表示されます。ダッシュボードの上部にあるステートメントは、変化率の解釈です。
- デフォルトでは、ダッシュボードにはメトリックの中央値が表示されます。ユーザーのさまざまなセグメントがアプリをどのように体験しているかを確認したい場合は、ダッシュボードの上部にあるドロップダウンから別のパーセンタイルを選択します。
赤、緑、灰色はどういう意味ですか?
ほとんどのメトリックには望ましいトレンド方向があるため、ダッシュボードは色を使用して、メトリックのデータが良い方向にトレンドしているか悪い方向にトレンドしているかの解釈を表示します。
たとえば、ページの最初の入力遅延(小さいはずの値)を追跡しているとします。この値が増加している場合、ダッシュボードにはメトリックの変化率が赤で表示され、考えられる問題に注意を促します。ただし、値が減少または変更されていない場合、ダッシュボードにはパーセンテージがそれぞれ緑色または灰色で表示されます。
ネットワークリクエストの応答ペイロードサイズなど、メトリックに明確な望ましいトレンド方向がない場合、データのトレンドに関係なく、ダッシュボードには常にメトリックの変化率が灰色で表示されます。
実線と破線はどういう意味ですか?
濃い青色の実線—時間の経過に伴うメトリックの値
水色の破線—過去の特定の時間におけるメトリックの値
たとえば、過去7日間のグラフを表示することを選択し、8月30日にカーソルを合わせると、水色の破線は8月23日の指標の値を示します。
[デバイス上]タブの概要
[デバイス上]タブで、アプリ内のすべてのページのページ読み込みトレースの概要(上の表)と、開発者がインストルメントしたカスタムコードトレース(下の表)を見つけます。
これらのトレースの詳細
ページ読み込みトレース—これらはアプリの各ページについて自動的に収集されたトレースです。各トレースは、最初のコンテンツの多いペイントやDOM関連のイベントなどのメトリックを収集します。
カスタムコードトレース—これらは、特定のタスクまたは一連のタスクを監視するために独自のコードに組み込むトレースです。カスタムメトリックとカスタム属性をカスタムコードトレースに追加することもできます。
各トレースのデータをさらに表示
[デバイス上]タブから、さまざまな画面をクリックしてトレースを探索し、関心のある指標にドリルダウンできます。ほとんどのページでは、[
のフィルター]ボタン(画面の左上)を使用して、属性でデータをフィルター処理できます。次に例を示します。
- ページのURLでフィルタリングして、サイトの特定のページのデータを表示します
- 効果的な接続タイプでフィルタリングして、3g接続がアプリに与える影響を確認します
- 国でフィルタリングして、データベースの場所が特定の地域に影響を与えていないことを確認します
トレースの収集されたすべてのメトリックを表示する
[デバイス上]タブから特定のトレースをクリックすると、メトリックカード上のトレースのデータの概要が表示されます。
ページ読み込みトレース
使用可能なメトリックカードには、最初のペイント、最初のコンテンツフルペイント、最初の入力遅延、およびDOM関連のイベントが含まれます。
- 画面の右上にあるオプションを使用して、メトリックのデータを集計または時間の経過とともに表示します。
- 特定のメトリックのデータをより詳細に確認するには、メトリックカードの[詳細を表示]をクリックします。
カスタムコードトレース
期間メトリックカードは、このタイプのトレースのデフォルトメトリックであるため、常に使用できます。カスタムコードトレースにカスタムメトリックを追加した場合、それらのメトリックカードも表示されます。
- 画面の右上にあるオプションを使用して、メトリックのデータを集計または経時的に表示します。
- 特定のメトリックのデータをより詳細に確認するには、メトリックカードの[詳細を表示]をクリックします。
データに関する詳細情報を表示する
メトリックカードで[詳細を表示]をクリックすると、収集されたデータに関するより詳細な情報を確認し、より豊富な分析機能を使用できます。たとえば、属性でデータをフィルタリングおよびセグメント化できます。
[ネットワーク]タブの概要
[ネットワーク]タブで、すべてのHTTP / Sネットワークリクエストトレースの概要を確認します。
これらのトレースの詳細
HTTP / Sネットワークリクエストトレースは、アプリがサービスエンドポイントにリクエストを発行してから、そのエンドポイントからの応答が完了するまでのデータを収集する、自動的に収集されるトレースです。これらのトレースは、応答時間や応答ペイロードサイズなどのメトリックを収集します。
コンソールでは、ネットワーク要求トレースのデータがURLパターンに集約されます。
各トレースのデータをさらに表示
[ネットワーク]タブから、さまざまな画面をクリックしてトレースを探索し、関心のあるメトリックにドリルダウンできます。ほとんどのページでは、[
のフィルター]ボタン(画面の左上)を使用して、属性でデータをフィルター処理できます。次に例を示します。
- ページURLでフィルタリングして、サイトの特定のページのデータを表示します
- 効果的な接続タイプでフィルタリングして、3g接続がアプリに与える影響を確認します
- 国でフィルタリングして、データベースの場所が特定の地域に影響を与えていないことを確認します
トレースのすべてのメトリックを表示する
[ネットワーク]タブから特定のURLパターンをクリックすると、メトリックカード上のトレースのデータの概要が表示されます。使用可能なメトリックカードは、このタイプのトレースのデフォルトのメトリックであるため、応答時間と応答ペイロードサイズです。
画面の右上にあるオプションを使用して、さまざまなデータをまとめて、または時間の経過とともに表示します。
特定のメトリックのデータをより詳細に確認するには、メトリックカードの[詳細を表示]をクリックします。
データに関する詳細情報を表示する
メトリックカードで[詳細を表示]をクリックすると、収集されたデータに関するより詳細な情報を確認し、より豊富な分析機能を使用できます。たとえば、属性でデータをフィルタリングおよびセグメント化できます。