性能監控使用跟踪來收集有關應用程序中受監控進程的數據。跟踪是一份報告，其中包含在您的應用程序中的兩個時間點之間捕獲的數據。
對於 Web 應用程序，性能監控會自動為您的應用程序的每個頁面收集跟踪，稱為頁面加載跟踪。每個頁面加載跟踪收集以下默認指標：
first paint — 衡量用戶導航到頁面與發生任何視覺變化之間的時間的指標
first contentful paint — 衡量用戶導航到頁面和顯示有意義的內容（如圖像或文本）之間的時間的指標
domInteractive — 衡量用戶導航到頁面與頁面被認為對用戶具有交互性之間的時間的指標
domContentLoadedEventEnd — 衡量用戶導航到頁面與初始 HTML 文檔完全加載和解析之間的時間的指標
loadEventEnd — 衡量用戶導航到頁面與當前文檔的加載事件完成之間的時間的指標
首次輸入延遲— 衡量用戶與頁面交互與瀏覽器能夠響應該輸入之間的時間的指標
您可以在跟踪表的頁面加載子選項卡中查看來自這些跟踪的數據，該子選項卡位於性能儀表板的底部（稍後在此頁面上了解有關使用控制台的更多信息）。
頁面加載跟踪的定義
此跟踪測量有關應用程序中頁面加載方式的幾個指標，特別是達到常見加載點所需的時間，如響應式應用程序。
頁面加載跟踪可幫助您跟踪應用程序的核心網絡生命力，例如首次內容繪製。
為頁面加載跟踪收集的指標
這些跟踪是開箱即用的跟踪，因此您不能向它們添加自定義指標或自定義屬性。
第一次油漆
該指標衡量用戶導航到頁面與發生任何視覺變化之間的時間。
此指標很有用，因為第一次繪製會向您的用戶發出頁面開始加載的信號。
當用戶導航到頁面時啟動。
當發生任何視覺變化時停止，包括背景顏色變化或標題加載。
第一個內容豐富的油漆
該指標衡量用戶導航到頁面與顯示有意義的內容（如圖像或文本）之間的時間。
此指標有助於深入了解您的用戶多久能看到您應用的任何實際內容，而不僅僅是新的背景顏色或標題。
當用戶導航到頁面時啟動。
在瀏覽器呈現 DOM 中的第一個內容後立即停止，包括任何文本、圖像（包括背景圖像）、非白色畫布或 SVG。
dom交互
該指標衡量用戶導航到頁面與頁面被認為對用戶具有交互性之間的時間。
此指標有助於深入了解您的用戶可以在多長時間內實際與應用中的元素（如按鈕和超鏈接）進行交互，而不僅僅是在屏幕上看到它們。請注意，這並不意味著瀏覽器將響應交互（對於此指標，請參閱第一個輸入延遲跟踪）。
當用戶導航到頁面時啟動。
在用戶代理將當前 HTML 文檔的就緒狀態設置為“交互式”之前立即停止。
domContentLoadedEventEnd
該指標測量用戶導航到頁面與初始 HTML 文檔完全加載和解析之間的時間。
當用戶導航到頁面時啟動。
在初始 HTML 文檔完全加載和解析 (
DOMContentLoaded) 後立即停止，但這並不意味著樣式表、圖像和子框架已完成加載。
加載事件結束
該指標測量用戶導航到頁面與當前文檔的加載事件完成之間的時間。
此指標有助於深入了解加載所有內容（包括樣式表和圖像）所需的時間。
當用戶導航到頁面時啟動。
在當前 HTML 文檔的加載事件完成後立即停止。
首次輸入延遲
該指標衡量用戶與頁面交互與瀏覽器能夠響應該輸入之間的時間。
這個指標很有用，因為瀏覽器對用戶交互的響應給了你的用戶他們對你的應用程序響應能力的第一印象。
當用戶第一次與頁面上的元素交互時啟動，例如單擊按鈕或超鏈接。
在瀏覽器能夠響應輸入後立即停止，這意味著瀏覽器不忙於加載或解析您的內容。
請注意，要測量第一個輸入延遲指標，您需要為該指標添加 polyfill 庫。有關安裝說明，請參閱庫的文檔。
跟踪、查看和過濾性能數據
要查看實時性能數據，請確保您的應用使用與實時數據處理兼容的性能監控 SDK 版本。了解有關實時性能數據的更多信息。
在儀表板中跟踪關鍵指標
要了解您的關鍵指標的趨勢，請將它們添加到績效儀表板頂部的指標板。您可以通過查看每週的更改或驗證代碼中最近的更改是否正在提高性能來快速識別回歸。
要將指標添加到指標板，請執行以下步驟：
- 轉到 Firebase 控制台中的性能儀表板。
- 單擊一個空的指標卡，然後選擇一個現有指標以添加到您的看板。
- 單擊填充的指標卡上的以獲得更多選項，例如替換或刪除指標。
指標板以圖形形式和數字百分比變化顯示隨時間收集的指標數據。
了解有關使用儀表板的更多信息。
查看痕跡及其數據
要查看您的跟踪記錄，請轉到 Firebase 控制台中的性能儀表板，向下滾動到跟踪記錄表，然後單擊相應的子選項卡。該表顯示了每個跟踪的一些主要指標，您甚至可以按特定指標的百分比變化對列表進行排序。
Performance Monitoring 在 Firebase 控制台中提供了一個故障排除頁面，其中突出顯示了指標變化，使您可以輕鬆快速地解決性能問題並將其對您的應用和用戶的影響降至最低。當您了解潛在的性能問題時，例如在以下情況下，您可以使用故障排除頁面：
- 您在儀表板上選擇相關指標，您會注意到一個大的增量。
- 在跟踪表中，您排序以在頂部顯示最大的增量，並且您會看到顯著的百分比變化。
- 您會收到一封電子郵件警報，通知您存在性能問題。
您可以通過以下方式訪問故障排除頁面：
- 在指標儀表板上，單擊查看指標詳細信息按鈕。
- 在任何指標卡上，選擇 => View details 。故障排除頁面顯示有關您選擇的指標的信息。
- 在跟踪表中，單擊跟踪名稱或與該跟踪關聯的行中的任何指標值。
- 在電子郵件警報中，單擊立即調查。
當您單擊跟踪表中的跟踪名稱時，您可以深入了解感興趣的指標。單擊Filter 按鈕以按屬性過濾數據，例如：
- 按頁面 URL過濾以查看您網站特定頁面的數據
- 按有效連接類型過濾以了解 3g 連接如何影響您的應用
- 按國家/地區過濾以確保您的數據庫位置不影響特定區域
了解有關查看跟踪數據的更多信息。
下一步
了解有關使用屬性檢查性能數據的更多信息。
詳細了解如何在 Firebase 控制台中跟踪性能問題。
為降低應用程序性能的頁面加載設置警報。例如，如果特定頁面的首次輸入延遲超過您設置的閾值，您可以為您的團隊配置電子郵件警報。