在控制台中監控性能數據

要查看實時性能數據,請確保您的應用使用與實時數據處理兼容的性能監控 SDK 版本。了解有關實時性能數據的更多信息

跟踪儀表板中的關鍵指標

要了解關鍵指標的趨勢,請將它們添加到性能儀表板頂部的指標板上。您可以通過查看每週更改來快速識別回歸,或者驗證您的代碼中最近的更改是否正在提高性能。

Firebase 性能監控儀表板中的指標板圖像

以下是您可以跟踪的一些示例趨勢:

  • 當您的應用加載某些 JavaScript 文件時,首次輸入延遲有所改進
  • 在切換到對資產使用 CDN 後,第一次內容繪製的時間減少
  • 由於您實現了縮略圖的使用,網絡請求的響應負載大小下降
  • 生態系統中斷期間第三方 API 調用的網絡響應時間增加

Firebase 項目的每個成員都可以配置自己的指標板。您可以跟踪對您很重要的指標,而其他項目成員可以在他們自己的板上跟踪完全不同的關鍵指標集。

要將指標添加到您的指標板,請執行以下步驟:

  1. 轉到 Firebase 控制台中的性能信息中心
  2. 單擊一個空的指標卡,然後選擇一個現有指標添加到您的板上。
  3. 單擊填充的指標卡上的以獲取更多選項,例如替換或刪除指標。

指標板以圖形形式和數字百分比變化顯示隨時間收集的指標數據。

  • 每個指標卡顯示指標值在選定時間範圍內的百分比變化,以及指標最近收集的值。指標板頂部的聲明是對百分比變化的解釋。
  • 默認情況下,指標板顯示指標的第 75 個百分位值,與Core Web Vitals一致。如果您想查看不同部分的用戶如何體驗您的應用,請從儀表板頁面頂部的下拉列表中選擇不同的百分位數。

紅色、綠色和灰色是什麼意思?

大多數指標都有所需的趨勢方向,因此指標板使用顏色來顯示指標數據是朝著好的還是壞的方向發展的解釋。

例如,假設您正在跟踪頁面的第一次輸入延遲(應該很小的值)。如果此值增加,則指標板將指標的百分比變化顯示為紅色,提醒您注意可能存在的問題。但是,如果該值減少或不變,則指標板將分別以綠色或灰色顯示百分比。

如果指標沒有明顯的所需趨勢方向,例如網絡請求的響應負載大小,則指標板始終以灰色顯示指標的百分比變化,無論數據趨勢如何。

實線和虛線是什麼意思?

  • 深藍色實線 — 指標隨時間變化的值

  • 淺藍色虛線 — 指標在過去特定時間的值
    例如,如果您選擇顯示過去 7 天的圖表,並將鼠標懸停在 8 月 30 日,則淺藍色虛線會告訴您 8 月 23 日的指標值。



查看痕跡及其數據

您可以在性能儀表板底部的跟踪表中查看應用程序的所有跟踪。該表將每種類型的跟踪分組在適當的子選項卡中。例如,所有網絡請求跟踪都列在網絡請求子選項卡下。

跟踪表顯示每個跟踪的一些頂級指標的值,以及每個指標值的百分比變化。這些值是根據在儀表板選項卡頂部設置的百分位數和時間範圍的選擇來計算的。這裡有些例子:

  • 如果您選擇75%的百分位和Last 7 days的時間範圍,則該指標的值將是從最近一天收集的數據的第 75 個百分位,百分比變化將是自 7 天前的變化。
  • 如果您隨後將時間範圍更改為Last 24 hours ,那麼指標的值將是從最近一小時收集的數據的中位數,百分比變化將是自 24 小時前的變化。

您可以按指標值或特定指標的百分比變化對每個子選項卡中的跟踪列表進行排序。這可以幫助您快速識別應用程序中的潛在問題。

要查看特定跟踪的所有指標和數據,請單擊跟踪表中的跟踪名稱。本頁的以下部分提供了更多詳細信息。

查看特定跟踪的更多數據

性能監控在 Firebase 控制台中提供了一個故障排除頁面,該頁面突出顯示了指標更改,從而可以輕鬆快速地解決並最大限度地減少性能問題對您的應用和用戶的影響。當您了解潛在的性能問題時,您可以使用故障排除頁面,例如,在以下情況下:

  • 您在儀表板上選擇相關指標,您會注意到一個很大的增量。
  • 在跟踪表中,您排序以在頂部顯示最大的增量,並且您會看到顯著的百分比變化。
  • 您會收到一封電子郵件警報,通知您存在性能問題。

您可以通過以下方式訪問故障排除頁面:

  • 在指標儀表板上,單擊查看指標詳細信息按鈕。
  • 在任何度量卡上,選擇 => 查看詳細信息。故障排除頁面顯示有關您選擇的指標的信息。
  • 在跟踪表中,單擊跟踪名稱或與該跟踪關聯的行中的任何度量值。
  • 在電子郵件警報中,單擊立即調查

當您單擊跟踪表中的跟踪名稱時,您可以深入了解感興趣的指標。點擊過濾按鈕,按屬性過濾數據,例如:

按屬性過濾的 Firebase 性能監控數據的圖像
  • 頁面 URL過濾以查看站點特定頁面的數據
  • 有效連接類型過濾以了解 3g 連接如何影響您的應用
  • 國家/地區過濾以確保您的數據庫位置不會影響特定區域

查看所有收集的跟踪指標

單擊跟踪後,您可以深入了解感興趣的指標:

  • 網絡請求跟踪- 可用的指標選項卡是響應時間響應負載大小
  • 自定義代碼跟踪-持續時間指標選項卡始終可用(此類跟踪的默認指標)。如果您將任何自定義指標添加到自定義代碼跟踪,則還會顯示這些指標選項卡。
  • 頁面加載跟踪- 可用的指標選項卡包括first paintfirst contentful paintfirst input delay和 DOM 相關事件。

查看有關數據的深入信息

您可以按屬性過濾和細分數據,也可以單擊以在應用程序使用會話的上下文中查看數據。

例如,要了解您最近的網絡響應時間為何緩慢,以及某個國家/地區是否影響性能,請執行以下步驟:

  1. 從屬性下拉列表中選擇國家
  2. 在表格中,按最新值排序以查看對您的網絡響應時間影響最大的國家/地區。
  3. 選擇具有最大最新值的國家以將它們繪製在圖表上。然後將光標懸停在圖表中的時間線上,以了解這些國家/地區的網絡響應時間何時變慢。
  4. 要進一步調查特定國家/地區網絡響應時間問題的根本原因,請為這些國家/地區添加過濾器並繼續調查其他屬性(如無線電類型和設備)。