功能推出的效能監控

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 新增到您的應用
  • 將自訂程式碼追蹤新增至您的程式碼以測量特定功能
  • 設定遠端配置參數和條件值以控制/推出新功能
  • 了解如何使用效能監控儀表板來識別部署期間的問題
  • 設定效能警報,以便在應用程式的效能超過您設定的閾值時通知您

了解更多