功能推出的性能监控

使用集合让一切井井有条 根据您的偏好保存内容并对其进行分类。

一、概述

在此 Codelab 中,您将学习如何在功能推出期间监控应用的性能。我们的示例应用程序将具有基本功能,并且设置为根据 Firebase 远程配置标志显示不同的背景图像。我们将通过检测跟踪来监控应用程序的性能,对应用程序进行配置更改,监控效果并了解我们如何提高性能。

你会学到什么

  • 如何将 Firebase 性能监控添加到您的移动应用程序以获得开箱即用的指标(例如应用程序启动时间和缓慢或冻结的帧)
  • 如何添加自定义跟踪以了解用户旅程的关键代码路径
  • 如何使用 Performance Monitoring 仪表板了解您的指标并跟踪重要更改,例如功能的推出
  • 如何设置性能警报以监控您的关键指标
  • 如何推出 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插件向 Firebase 项目注册您的 Android 应用程序,并将必要的 Firebase 配置文件、插件和依赖项添加到您的 Android 项目——所有这些都在 Android Studio 中完成

将您的应用连接到 Firebase

  1. 转到Android Studio / Help > Check for updates以确保您使用的是最新版本的 Android Studio 和 Firebase Assistant。
  2. 选择“工具” > “Firebase”以打开“助手”窗格。

c0e42ef063d21eab.png

  1. 选择Performance Monitoring以添加到您的应用程序,然后单击Get started with Performance Monitoring
  2. 单击连接到 Firebase以将您的 Android 项目连接到 Firebase (这将在您的浏览器中打开 Firebase 控制台)
  3. 在 Firebase 控制台中,点击添加项目,然后输入一个 Firebase 项目名称(如果您已有一个 Firebase 项目,则可以选择该现有项目) 。单击继续并接受条款以创建 Firebase 项目和新的 Firebase 应用程序。

接下来您应该会看到一个对话框,用于将您的新 Firebase 应用程序连接到您的 Android Studio 项目。

51a549ebde2fe57a.png

  1. 单击“连接”
  2. 打开安卓工作室。在“助手”窗格中,您将看到您的应用已连接到 Firebase 的确认信息。

40c24c4a56a45990.png

将性能监控添加到您的应用程序

在 Android Studio 的Assistant面板中,点击Add Performance Monitoring to your app

您应该看到一个接受更改的对话框,之后 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中,如果通过 Remote Config 定义了seasonal_image_url ,则该功能将被启用,下载的图像将显示为主页的背景。否则,将显示默认图像(如上所示)。

4.设置远程配置

现在您的应用程序正在运行,您可以设置新的功能标志。

  1. Firebase 控制台的左侧面板中,找到“参与”部分,然后单击“远程配置”
  2. 单击创建配置按钮以打开配置表单并添加seasonal_image_url作为参数键。
  3. 单击添加描述,然后输入此描述: Shows a seasonal image (replaces default) in the main page when the restaurant list is empty.
  4. 点击Add new -> Conditional value -> Create new condition
  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. 给trace添加一个自定义属性

对于自定义代码跟踪,性能监控会自动记录默认属性(常见元数据,如应用程序版本、国家/地区、设备等),以便您可以在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 控制台中,选择包含您的 Friendly Eats 应用的项目。

在左侧面板中,找到Release & Monitor部分,然后单击Performance

您应该在指标面板中看到带有第一个数据点的性能仪表板!性能监控 SDK 从您的应用程序收集性能数据,并在收集后的几分钟内显示出来。

f57e5450b70034c9.png

这个指标板是您可以跟踪应用程序关键指标的地方。默认视图包括您的应用启动时间跟踪的持续时间,但您可以添加您最关心的指标。由于您正在跟踪添加的新功能,因此您可以定制仪表板以显示自定义代码跟踪的持续时间splash_screen_trace

  1. 单击其中一个空的Select a metric框。
  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 ,它测量了下载和处理图像所花费的时间。从跟踪的Duration值中,您可以看到此下载和处理花费了大量时间。

439adc3ec71805b7.png

  1. 由于您有splash_seasonal_image_processing的数据,您可以将此跟踪的持续时间添加到仪表板选项卡顶部的指标板上。

与之前类似,单击其中一个空的Select a metric框。在对话框窗口中,选择跟踪类型Custom traces和跟踪名称splash_seasonal_image_processing 。最后,单击Select metric将此指标添加到指标板。

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 Performance Monitoring,您看到了启用新功能对最终用户的以下影响:

  1. SplashScreenActivity上花费的时间增加了。
  2. splash_seasonal_image_processing的持续时间非常长。
  3. 延迟是由于图像下载的响应时间和图像所需的相应处理时间造成的。

在下一步中,您将通过回滚该功能并确定如何改进该功能的实现来减轻对性能的影响。

10.回滚功能

在初始屏幕期间增加用户的等待时间是不可取的。 Remote Config 的主要优势之一是无需向用户发布另一个版本即可暂停和撤消部署。这使您可以快速对问题(例如您在上一步中发现的性能问题)做出反应,并最大限度地减少不满意的用户数量。

作为一种快速缓解措施,您可以将推出百分位数重置为0 ,以便您的所有用户将再次看到默认图像:

  1. 返回到 Firebase 控制台中的Remote Config页面
  2. 单击页面顶部的条件
  3. 单击您之前添加的Seasonal image rollout条件。
  4. 将百分位数更改为0%。
  5. 单击保存条件
  6. 单击发布更改并确认更改。

18c4f1cbac955a04.png

在 Android Studio 中重启应用,你应该会看到原来的空状态主界面:

d946cab0df319e50.png

11.修复性能问题

您之前在 Codelab 中发现,为启动画面下载图像会导致您的应用速度变慢。仔细查看下载的图像,您会发现您使用的是图像的原始分辨率,超过 2MB!解决性能问题的一种快速解决方法是将质量降低到更合适的分辨率,从而减少图像的下载时间。

再次推出远程配置值

  1. 返回到 Firebase 控制台中的Remote Config页面
  2. 单击seasonal_image_url参数的编辑图标。
  3. Value for Seasonal image rollout更新为https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640 ,然后点击Save

828dd1951a2ec4a4.png

  1. 单击页面顶部的“条件”选项卡。
  2. 单击Seasonal image rollout ,然后将百分位设置回 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. 现在您已经改进了初始屏幕的性能,您可以设置警报以在跟踪超过您设置的阈值时通知您。打开Performance仪表板并单击splash_screen_trace的溢出菜单(三点)图标,然后单击Alert settings

4bd0a2a1faa14479.png

  1. 单击开关以启用持续时间警报。将阈值设置为略高于您看到的值,这样如果您的splash_screen_trace超过阈值,您将收到一封电子邮件。
  1. 单击保存以创建您的警报。向下滚动到traces 表,然后单击Custom traces选项卡以查看您的警报已启用!

2bb93639e2218d1.png

13. 恭喜!

恭喜!您启用了 Firebase Performance Monitoring SDK 并收集了跟踪记录来衡量新功能的性能!您监控了新功能推出的关键性能指标,并在发现性能问题时迅速做出反应。这一切都可以通过远程配置更改配置并实时监控性能问题来实现。

我们涵盖的内容

  • 将 Firebase 性能监控 SDK 添加到您的应用
  • 将自定义代码跟踪添加到您的代码以测量特定功能
  • 设置远程配置参数和条件值以控制/推出新功能
  • 了解如何使用性能监控仪表板在推出期间识别问题
  • 设置性能警报以在您的应用程序性能超过您设置的阈值时通知您

了解更多