功能推出的性能監控

1. 概述

在此 Codelab 中,您將了解如何在功能推出期間監控應用的性能。我們的示例應用程序將具有基本功能,並且它被設置為根據 Firebase 遠程配置標誌顯示不同的背景圖像。我們將通過檢測跟踪來監控應用程序的性能、對應用程序進行配置更改、監控效果並了解如何提高性能。

你將學到什麼

  • 如何將 Firebase 性能監控添加到您的移動應用中以獲取開箱即用的指標(例如應用啟動時間以及緩慢或凍結的幀)
  • 如何添加自定義跟踪以了解用戶旅程的關鍵代碼路徑
  • 如何使用性能監控儀表板來了解您的指標並跟踪重要更改(例如功能的推出)
  • 如何設置績效警報來監控關鍵指標
  • 如何實施 Firebase 遠程配置更改

先決條件

  • Android Studio 4.0或更高版本
  • API 級別 16 或更高的 Android 模擬器。
  • Java 版本 8 或更高版本
  • Firebase 遠程配置的基本了解

2. 設置示例項目

下載代碼

運行以下命令來克隆此 Codelab 的示例代碼。這將在您的計算機上創建一個名為codelab-perf-rc-android的文件夾:

$ git clone https://github.com/FirebaseExtended/codelab-feature-rollout-performance.git

如果你的機器上沒有Git,也可以直接從GitHub下載代碼。

firebase-perf-rc-android-start文件夾下的項目導入Android Studio。您可能會看到一些運行時異常,或者可能會看到有關缺少google-services.json文件的警告。我們將在下一節中糾正這個問題。

在此 Codelab 中,您將使用Firebase Assistant插件將您的 Android 應用註冊到 Firebase 項目,並向您的 Android 項目添加必要的 Firebase 配置文件、插件和依賴項 -全部都在 Android Studio 中完成

將您的應用連接到 Firebase

  1. 轉到Android Studio /幫助>檢查更新,確保您使用的是最新版本的 Android Studio 和 Firebase Assistant。
  2. 選擇“工具” > “Firebase”以打開“助手”窗格。

c0e42ef063d21eab.png

  1. 選擇要添加到您的應用程序的性能監控,然後單擊性能監控入門
  2. 單擊“連接到 Firebase”以將您的 Android 項目與 Firebase 連接(這將在瀏覽器中打開 Firebase 控制台)
  3. 在 Firebase 控制台中,點擊添加項目,然後輸入 Firebase 項目名稱(如果您已有 Firebase 項目,則可以選擇該現​​有項目) 。單擊繼續並接受條款以創建 Firebase 項目和新的 Firebase 應用。

接下來您應該會看到一個對話框,用於將新的 Firebase 應用程序連接到您的 Android Studio 項目。

51a549ebde2fe57a.png

  1. 單擊“連接”
  2. 打開 Android Studio。在“助理”窗格中,您將看到您的應用程序已連接到 Firebase 的確認信息。

40c24c4a56a45990.png

將性能監控添加到您的應用程序

在 Android Studio 的“助手”窗格中,單擊“將性能監控添加到您的應用程序”

您應該會看到一個接受更改的對話框,之後 Android Studio 應該同步您的應用程序以確保已添加所有必要的依賴項。

3046f3e1f5fea06f.png

最後,您應該在 Android Studio 的“助手”窗格中看到成功消息,表明所有依賴項均已正確設置。

62e79fd18780e320.png

作為附加步驟,請按照“(可選)啟用調試日誌記錄”步驟中的說明啟用調試日誌記錄。公共文檔中也提供了相同的說明。

3.運行應用程序

您現在應該在應用程序的模塊(應用程序級)目錄中看到google-services.json文件,並且您的應用程序現在應該可以編譯。在 Android Studio 中,單擊運行>運行“應用程序”以在 Android 模擬器上構建並運行應用程序。

當應用程序運行時,您應該首先看到如下所示的啟動屏幕:

ffbd413a6983b205.png

然後,幾秒鐘後,將顯示帶有默認圖像的主頁:

d946cab0df319e50.png

幕後發生了什麼?

啟動畫面在SplashScreenActivity中實現,並執行以下操作:

  1. onCreate()中,我們初始化 Firebase 遠程配置設置並獲取您稍後將在本 Codelab 的遠程配置儀表板中設置的配置值。
  2. executeTasksBasedOnRC()中,我們讀取seasonal_image_url標誌的配置值。如果配置值提供了 URL,我們會同步下載圖像。
  3. 下載完成後,應用程序將導航到MainActivity並調用finish()來結束SplashScreenActivity

MainActivity中,如果通過遠程配置定義了seasonal_image_url ,則該功能將啟用,並且下載的圖像將顯示為主頁的背景。否則,將顯示默認圖像(如上所示)。

4. 設置遠程配置

現在您的應用程序正在運行,您可以設置新功能標誌。

  1. Firebase 控制台的左側面板中,找到Engage部分,然後單擊Remote Config
  2. 單擊創建配置按鈕打開配置表單並添加seasonal_image_url作為參數鍵。
  3. 單擊添加描述,然後輸入此描述: Shows a seasonal image (replaces default) in the main page when the restaurant list is empty.
  4. 單擊新增->條件值->創建新條件
  5. 對於條件名稱,輸入Seasonal image rollout
  6. 對於Applies if...部分,選擇User in random percentile <= 0%(您希望將該功能保持禁用狀態,直到準備好在後續步驟中推出為止。)
  7. 單擊創建條件。稍後您將使用此條件向您的用戶推出新功能。

7a07526eb9e81623.png

  1. 打開“創建您的第一個參數”表單並找到“季節性圖像值”卷展欄字段。輸入將下載季節性圖像的 URL: https://images.unsplash.com/photo-1552691021-7043334e0b51
  2. 將默認值保留為空字符串。這意味著將顯示代碼庫中的默認圖像,而不是從 URL 下載的圖像。
  3. 單擊“保存”

99e6cd2ebcdced.png

您可以看到新配置已創建為草稿。

  1. 單擊發布更改並確認頂部的更改以更新您的應用程序。

39cd3e96d370c7ce.png

5.添加數據加載時間監控

您的應用程序在顯示MainActivity之前預加載一些數據,並顯示啟動屏幕以隱藏此過程。您不希望用戶在此屏幕上等待太長時間,因此通常監視啟動屏幕的顯示時間是有益的。

Firebase 性能監控提供了一種方法來做到這一點。您可以檢測自定義代碼跟踪來監控應用程序中特定代碼的性能 - 例如數據的加載時間和新功能的處理時間。

要跟踪啟動屏幕顯示的時間,您需要向SplashScreenActivity添加自定義代碼跟踪,它是實現啟動屏幕的Activity

  1. 初始化、創建並啟動名為splash_screen_trace的自定義代碼跟踪:

SplashScreenActivity.java

// ...
import com.google.firebase.perf.FirebasePerformance;
import com.google.firebase.perf.metrics.Trace;
// ...

public class SplashScreenActivity extends AppCompatActivity {

    private static final String TAG = "SplashScreenActivity";
    private static final String SEASONAL_IMAGE_URL_RC_FLAG = "seasonal_image_url";

    // TODO: Initialize splash_screen_trace
    private final Trace splashScreenTrace = FirebasePerformance.startTrace("splash_screen_trace");
    
    // ...
}
  1. SplashScreenActivityonDestroy()方法中結束跟踪:

SplashScreenActivity.java

@Override
protected void onDestroy() {
    super.onDestroy();

    // TODO: Stop the splash_screen_trace here
    splashScreenTrace.stop();
}

由於您的新功能會下載並處理圖像,因此您將添加第二個自定義代碼跟踪,該跟踪將跟踪您的功能添加到SplashScreenActivity的額外時間。

  1. 初始化、創建並啟動名為splash_seasonal_image_processing的自定義代碼跟踪:

SplashScreenActivity.java

private void executeTasksBasedOnRC(FirebaseRemoteConfig rcConfig) {
    String seasonalImageUrl = rcConfig.getString(SEASONAL_IMAGE_URL_RC_FLAG);
    Log.d(TAG, SEASONAL_IMAGE_URL_RC_FLAG + ": " + seasonalImageUrl);

    if (!seasonalImageUrl.isEmpty()) {
        // TODO: Start the splash_seasonal_image_processing here
        final Trace seasonalImageProcessingTrace = FirebasePerformance
            .startTrace("splash_seasonal_image_processing");

        // ...
    }
}
  1. RequestListeneronLoadFailed()onResourceReady()方法中結束跟踪:

SplashScreenActivity.java

Glide.with(SplashScreenActivity.this.getApplicationContext())
    .asBitmap()
    .load(seasonalImageUrl)
    .signature(new ObjectKey(Utils.getCacheUUID()))
    .listener(new RequestListener<Bitmap>() {
        @Override
        public boolean onLoadFailed(
            @Nullable GlideException e,
            Object model, Target<Bitmap> target,
            boolean isFirstResource) {

            // TODO: Stop the splash_seasonal_image_processing here
            seasonalImageProcessingTrace.stop();

            launchMainActivity();
            return true;
        }

        @Override
        public boolean onResourceReady(Bitmap resource, Object model,
            Target<Bitmap> target, DataSource dataSource,
            boolean isFirstResource) {

            // TODO: Stop the splash_seasonal_image_processing here
            seasonalImageProcessingTrace.stop();

            launchMainActivity();
            return true;
        }
     })
     .preload();

現在您已經添加了自定義代碼跟踪來跟踪初始屏幕持續時間 ( splash_screen_trace)和新功能的處理時間 ( splash_seasonal_image_processing ),請再次在 Android Studio 中運行該應用。您應該看到一條日誌消息,其中包含Logging trace metric: splash_screen_trace ,後跟跟踪的持續時間。您不會看到splash_seasonal_image_processing的日誌消息,因為您尚未啟用新功能。

6. 向跟踪添加自定義屬性

對於自定義代碼跟踪,性能監控會自動記錄默認屬性(常見元數據,如應用版本、國家/地區、設備等),以便您可以在Firebase 控制台中過濾跟踪數據。您還可以添加和監控自定義屬性

在您的應用程序中,您剛剛添加了兩個自定義代碼跟踪來監視啟動屏幕持續時間和新功能的處理時間。可能影響這些持續時間的一個因素是顯示的圖像是默認圖像還是必須從 URL 下載圖像。誰知道呢——您最終可能會使用不同的 URL 來下載圖像。

因此,讓我們向這些自定義代碼跟踪添加一個表示季節性圖像 URL 的自定義屬性。這樣,您以後就可以通過這些值過濾持續時間數據。

  1. executeTasksBasedOnRC方法的開頭添加splash_screen_trace的自定義屬性( seasonal_image_url_attribute ):

SplashScreenActivity.java

private void executeTasksBasedOnRC(FirebaseRemoteConfig rcConfig) {
    String seasonalImageUrl = rcConfig.getString(SEASONAL_IMAGE_URL_RC_FLAG);
    Log.d(TAG, SEASONAL_IMAGE_URL_RC_FLAG + ": " + seasonalImageUrl);

    // TODO: Add a custom attribute "seasonal_image_url_attribute" to splash_screen_trace
    if (seasonalImageUrl.isEmpty()) {
        splashScreenTrace.putAttribute("seasonal_image_url_attribute", "unset");
    } else {
        splashScreenTrace.putAttribute("seasonal_image_url_attribute", seasonalImageUrl);
    }

    // ...
}
  1. startTrace("splash_seasonal_image_processing")調用之後立即為splash_seasonal_image_processing添加相同的自定義屬性:

SplashScreenActivity.java

if (!seasonalImageUrl.isEmpty()) {
    // TODO: Start the splash_seasonal_image_processing here
    final Trace seasonalImageProcessingTrace = FirebasePerformance
        .startTrace("splash_seasonal_image_processing");

    // TODO: Add a custom attribute "seasonal_image_url_attribute" to splash_seasonal_image_processing
    seasonalImageProcessingTrace
        .putAttribute("seasonal_image_url_attribute", seasonalImageUrl);

    // ...
}

現在您已經為兩個自定義跟踪( splash_screen_tracesplash_seasonal_image_processing )添加了自定義屬性( seasonal_image_url_attribute ),請再次在Android Studio 中運行該應用。您應該看到一條日誌消息,其中包含Setting attribute 'seasonal_image_url_attribute' to 'unset' on trace 'splash_screen_trace'.您尚未啟用遠程配置參數seasonalImageUrl ,這就是unset屬性值的原因。

性能監控 SDK 將收集跟踪數據並將其發送到 Firebase。您可以在 Firebase 控制台的性能儀表板中查看數據,我們將在 Codelab 的下一步中詳細解釋。

7. 配置您的性能監控儀表板

配置您的儀表板以監控您的功能

Firebase 控制台中,選擇包含您的 Friendship 應用的項目。

在左側面板中,找到“發布和監控”部分,然後單擊“性能”

您應該會在指標板中看到您的績效儀表板,其中包含您的第一個數據點!性能監控 SDK 從您的應用程序收集性能數據並在收集後幾分鐘內顯示。

f57e5450b70034c9.png

您可以在該指標板中跟踪應用程序的關鍵指標。默認視圖包括應用程序啟動時間跟踪的持續時間,但您可以添加您最關心的指標。由於您正在跟踪添加的新功能,因此您可以定制儀表板以顯示自定義代碼跟踪splash_screen_trace的持續時間。

  1. 單擊空的“選擇指標”框之一。
  2. 在對話框窗口中,選擇跟踪類型“自定義跟踪”和跟踪名稱splash_screen_trace

1fb81f4dba3220e0.png

  1. 單擊Select metric ,您應該會看到splash_screen_trace的持續時間添加到您的儀表板!

您可以使用這些相同的步驟添加您關心的其他指標,以便您可以快速了解其性能隨時間甚至不同版本的變化。

1d465c021e58da3b.png

指標板是一個強大的工具,用於跟踪用戶體驗的關鍵指標的性能。對於此 Codelab,您在較窄的時間範圍內擁有一小組數據,因此您將使用其他儀表板視圖來幫助您了解功能推出的性能。

8. 推出你的功能

現在您已經設置了監控,接下來可以推出之前設置的 Firebase 遠程配置更改 ( seasonal_image_url)

要實施更改,您需要返回 Firebase 控制台中的“遠程配置”頁面,以增加定位條件的用戶百分比。通常,您會向一小部分用戶推出新功能,只有在確信沒有問題時才增加新功能。不過,在此 Codelab 中,您是該應用的唯一用戶,因此您可以將百分位更改為 100%。

  1. 單擊頁面頂部的“條件”選項卡。
  2. 單擊您之前添加的Seasonal image rollout條件。
  3. 將百分位數更改為 100%。
  4. 單擊保存條件
  5. 單擊發布更改並確認更改。

70f993502b27e7a0.png

返回 Android Studio,在模擬器中重新啟動應用程序以查看新功能。啟動屏幕後,您應該看到新的空狀態主屏幕!

b0cc91b6e48fb842.png

9. 檢查性能變化

現在,讓我們使用 Firebase 控制台中的性能儀表板來檢查啟動屏幕加載的性能。在 Codelab 的這一步中,您將使用儀表板的不同部分來查看性能數據。

  1. 在主儀表板選項卡上,向下滾動到跟踪表,然後單擊自定義跟踪選項卡。在此表中,您將看到之前添加的自定義代碼跟踪以及一些現成的跟踪
  2. 現在您已經啟用了新功能,請查找自定義代碼跟踪splash_seasonal_image_processing ,它測量下載和處理圖像所需的時間。從跟踪的持續時間值中,您可以看到此下載和處理需要大量時間。

439adc3ec71805b7.png

  1. 由於您有splash_seasonal_image_processing的數據,因此您可以將此跟踪的持續時間添加到“儀表板”選項卡頂部的指標板中。

與之前類似,單擊空的“選擇指標”框之一。在對話框窗口中,選擇跟踪類型“自定義跟踪”和跟踪名稱splash_seasonal_image_processing 。最後,單擊選擇指標將此指標添加到指標板。

7fb64d2340410576.png

  1. 為了進一步確認差異,您可以仔細查看splash_screen_trace的數據。單擊指標板中的splash_screen_trace卡,然後單擊查看指標詳細信息

b1c275c30679062a.png

  1. 在詳細信息頁面中,您將在左下角看到屬性列表,包括您之前創建的自定義屬性。單擊自定義屬性seasonal_image_url_attribute可在右側查看每個季節性圖像URL的啟動屏幕持續時間:

8fa1a69019bb045e.png

  1. 您的初始屏幕持續時間值可能與上面的屏幕截圖中的值略有不同,但與使用默認圖像(由“未設置”表示)相比,從 URL 下載圖像時的持續時間應該更長

在此 Codelab 中,持續時間較長的原因可能很簡單,但在實際應用中,可能並不那麼明顯。收集的持續時間數據將來自不同的設備,在各種網絡連接條件下運行應用程序,這些條件可能比您的預期更糟糕。讓我們看看如果這是真實情況,您將如何調查此問題。

  1. 單擊頁面頂部的“性能”返回到“儀表板”主選項卡: 640b696b79d90103.png
  2. 在頁面底部的跟踪表中,單擊網絡請求選項卡。在此表中,您將看到來自應用程序的所有網絡請求聚合為 URL 模式,包括images.unsplash.com/** URL 模式。如果將此響應時間的值與圖像下載和處理所需的總時間(即splash_seasonal_image_processing跟踪的持續時間)進行比較,您可以看到大量時間花費在下載圖像上。

6f92ce0f23494507.png

績效調查結果

使用 Firebase 性能監控,您發現啟用新功能對最終用戶產生了以下影響:

  1. SplashScreenActivity上花費的時間有所增加。
  2. splash_seasonal_image_processing的持續時間非常長。
  3. 延遲是由於圖像下載的響應時間以及圖像所需的相應處理時間造成的。

在下一步中,您將通過回滾該功能並確定如何改進該功能的實現來減輕對性能的影響。

10. 回滾功能

增加用戶在啟動屏幕期間的等待時間是不可取的。遠程配置的主要優點之一是能夠暫停和反轉部署,而無需向用戶發布另一個版本。這使您能夠快速對問題(例如您在上一步中發現的性能問題)做出反應,並最大限度地減少不滿意的用戶數量。

作為快速緩解措施,您可以將推出百分比重置回0 ,以便所有用戶都將再次看到默認圖像:

  1. 返回 Firebase 控制台中的遠程配置頁面
  2. 單擊頁面頂部的“條件”
  3. 單擊您之前添加的Seasonal image rollout條件。
  4. 將百分位數更改為0%。
  5. 單擊保存條件
  6. 單擊發布更改並確認更改。

18c4f1cbac955a04.png

在 Android Studio 中重新啟動應用程序,您應該看到原始的空狀態主屏幕:

d946cab0df319e50.png

11.修復性能問題

您之前在 Codelab 中發現,為啟動畫面下載圖像會導致應用速度變慢。仔細查看下載的圖像,您會發現您使用的是圖像的原始分辨率,超過 2MB!解決性能問題的一種快速解決方法是將質量降低到更合適的分辨率,以便減少下載圖像的時間。

再次推出遠程配置值

  1. 返回 Firebase 控制台中的遠程配置頁面
  2. 單擊seasonal_image_url參數的編輯圖標。
  3. “季節性圖像”卷展欄的值更新為https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640 ,然後單擊“保存”

828dd1951a2ec4a4.png

  1. 單擊頁面頂部的“條件”選項卡。
  2. 單擊“季節性圖像”卷展欄,然後將百分位數設置回 100%。
  3. 單擊保存條件

1974fa3bb789f36c.png

  1. 單擊“發布更改”按鈕。

12. 測試修復並設置警報

在本地運行應用程序

將新配置值設置為使用不同的下載圖像 URL 後,再次運行應用程序。這次,您應該注意到在啟動屏幕上花費的時間比以前更短了。

b0cc91b6e48fb842.png

查看更改的性能

返回 Firebase 控制台中的性能儀表板以查看指標的外觀。

  1. 這次您將使用跟踪表導航到詳細信息頁面。在跟踪表下方的“自定義跟踪”選項卡中,單擊自定義跟踪splash_seasonal_image_processing以再次查看其持續時間指標的更詳細視圖。

2d7aaca03112c062.png

  1. 單擊自定義屬性seasonal_image_url_attribute可再次查看自定義屬性的細分。如果將鼠標懸停在 URL 上,您將看到與縮小尺寸圖像的新 URL 匹配的值: https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640 ?w=640(帶有?w=640在最後)。與此圖像關聯的持續時間值比前一個圖像的值要短得多,並且更容易被用戶接受!

10e30c037a4237a2.png

  1. 現在您已經改進了啟動屏幕的性能,您可以設置警報,以便在跟踪超過您設置的閾值時通知您。打開性能儀表板,單擊splash_screen_trace的溢出菜單(三點)圖標,然後單擊警報設置

4bd0a2a1faa14479.png

  1. 單擊切換開關以啟用持續時間警報。將閾值設置為略高於您看到的值,這樣如果您的splash_screen_trace超過閾值,您將收到一封電子郵件。
  1. 單擊“保存”以創建您的警報。向下滾動到跟踪表,然後單擊“自定義跟踪”選項卡即可看到您的警報已啟用!

2bb93639e2218d1.png

13. 恭喜!

恭喜!您啟用了 Firebase 性能監控 SDK 並收集了跟踪來衡量新功能的性能!您監控新功能推出的關鍵性能指標,並在發現性能問題時迅速做出反應。這一切都可以通過遠程配置進行配置更改並實時監控性能問題來實現。

我們涵蓋的內容

  • 將 Firebase 性能監控 SDK 添加到您的應用
  • 將自定義代碼跟踪添加到您的代碼中以測量特定功能
  • 設置遠程配置參數和條件值以控制/推出新功能
  • 了解如何使用性能監控儀表板來識別部署期間的問題
  • 設置性能警報,以便在應用程序的性能超過您設置的閾值時通知您

了解更多