1. Übersicht
In diesem Codelab erfahren Sie, wie Sie die Leistung Ihrer App während der Einführung einer Funktion im Blick behalten. Unsere Beispiel-App hat grundlegende Funktionen und ist so eingerichtet, dass je nach Firebase Remote Config-Flag ein anderes Hintergrundbild angezeigt wird. Wir werden die Instrumentierungs-Traces durchgehen, um die Leistung der App zu überwachen, eine Konfigurationsänderung für die App einführen, die Auswirkungen beobachten und sehen, wie wir die Leistung verbessern können.
Lerninhalte
- Firebase Performance Monitoring in Ihre mobile App einbinden, um standardmäßige Messwerte wie App-Startzeit und langsame oder eingefrorene Frames zu erhalten
- Benutzerdefinierte Traces hinzufügen, um kritische Codepfade auf Nutzerpfaden zu verstehen
- Wie Sie das Dashboard für die Leistungsüberwachung verwenden, um Ihre Messwerte zu verstehen und wichtige Änderungen wie die Einführung einer Funktion zu verfolgen
- Leistungsbenachrichtigungen einrichten, um wichtige Messwerte im Blick zu behalten
- Firebase Remote Config-Änderungen einführen
Vorbereitung
- Android Studio 4.0 oder höher
- Ein Android-Emulator mit API-Level 16 oder höher.
- Java-Version 8 oder höher
- Grundlegende Kenntnisse zu Firebase Remote Config
2. Beispielprojekt einrichten
Code herunterladen
Führen Sie den folgenden Befehl aus, um den Beispielcode für dieses Codelab zu klonen. Dadurch wird auf Ihrem Computer ein Ordner namens codelab-perf-rc-android
erstellt:
$ git clone https://github.com/FirebaseExtended/codelab-feature-rollout-performance.git
Wenn Git auf Ihrem Computer nicht vorhanden ist, können Sie den Code auch direkt von GitHub herunterladen.
Importieren Sie das Projekt im Ordner firebase-perf-rc-android-start
in Android Studio. Wahrscheinlich werden einige Laufzeitausnahmen oder eine Warnung zu einer fehlenden google-services.json
-Datei angezeigt. Wir werden dies im nächsten Abschnitt korrigieren.
In diesem Codelab verwenden Sie das Plug-in Firebase Assistant, um Ihre Android-App bei einem Firebase-Projekt zu registrieren und die erforderlichen Firebase-Konfigurationsdateien, Plug-ins und Abhängigkeiten zu Ihrem Android-Projekt hinzuzufügen – direkt in Android Studio.
App mit Firebase verbinden
- Prüfen Sie unter Android Studio/Hilfe > Nach Updates suchen, ob Sie die neuesten Versionen von Android Studio und Firebase Assistant verwenden.
- Wählen Sie Tools > Firebase, um den Bereich Assistant zu öffnen.
- Wählen Sie Leistungsüberwachung aus, um sie Ihrer App hinzuzufügen, und klicken Sie dann auf Einführung in die Leistungsüberwachung.
- Klicken Sie auf Connect to Firebase (Mit Firebase verbinden), um Ihr Android-Projekt mit Firebase zu verbinden. Die Firebase Console wird in Ihrem Browser geöffnet.
- Klicken Sie in der Firebase Console auf Projekt hinzufügen und geben Sie einen Namen für das Firebase-Projekt ein. Wenn Sie bereits ein Firebase-Projekt haben, können Sie stattdessen dieses Projekt auswählen. Klicken Sie auf Weiter und akzeptieren Sie die Nutzungsbedingungen, um das Firebase-Projekt und eine neue Firebase-App zu erstellen.
Als Nächstes sollte ein Dialogfeld angezeigt werden, über das Sie die neue Firebase App mit Ihrem Android Studio-Projekt verbinden können.
- Klicken Sie auf Verbinden.
- Öffnen Sie Android Studio. Im Bereich Assistant sehen Sie die Bestätigung, dass Ihre App mit Firebase verknüpft ist.
Leistungsüberwachung in Apps einbinden
Klicken Sie in Android Studio im Bereich Assistant auf App die Leistungsüberwachung hinzufügen.
Es sollte ein Dialogfeld mit der Option Änderungen akzeptieren angezeigt werden. Danach sollte Android Studio Ihre App synchronisieren, um sicherzustellen, dass alle erforderlichen Abhängigkeiten hinzugefügt wurden.
Schließlich sollte im Bereich Assistant in Android Studio die Erfolgsmeldung angezeigt werden, dass alle Abhängigkeiten korrekt eingerichtet sind.
Aktivieren Sie als zusätzlichen Schritt das Debug-Logging. Folgen Sie dazu der Anleitung unter „Optional: Debug-Logging aktivieren“. Eine solche Anleitung finden Sie auch in der öffentlichen Dokumentation.
3. Anwendung ausführen
Im Modulverzeichnis (auf App-Ebene) Ihrer App sollte jetzt die Datei google-services.json
angezeigt und die App sollte kompiliert werden. Klicken Sie in Android Studio auf Run > (Ausführen >). Führen Sie „app“ aus, um die App zu erstellen und in Ihrem Android-Emulator auszuführen.
Wenn die App ausgeführt wird, sollte zuerst ein Ladebildschirm wie der folgende angezeigt werden:
Nach einigen Sekunden wird dann die Hauptseite mit dem Standardbild angezeigt:
Was passiert im Hintergrund?
Der Splashscreen wird in SplashScreenActivity implementiert und führt Folgendes aus:
- In
onCreate()
initialisieren wir die Firebase Remote Config-Einstellungen und rufen die Konfigurationswerte ab, die Sie später in diesem Codelab im Remote Config-Dashboard festlegen. - In
executeTasksBasedOnRC()
wird der Konfigurationswert desseasonal_image_url
-Flags gelesen. Wenn über den Konfigurationswert eine URL angegeben wird, wird das Bild synchron heruntergeladen. - Sobald der Download abgeschlossen ist, ruft die App MainActivity auf und ruft
finish()
auf, umSplashScreenActivity
zu beenden.
Wenn in MainActivity
seasonal_image_url
über Remote Config definiert wurde, wird die Funktion aktiviert und das heruntergeladene Bild als Hintergrund der Hauptseite angezeigt. Andernfalls wird das Standardbild (siehe oben) angezeigt.
4. Remote Config einrichten
Nachdem Ihre App jetzt ausgeführt wird, können Sie die neue Feature-Flag einrichten.
- Suchen Sie im linken Bereich der Firebase Console den Bereich Interagieren und klicken Sie dann auf Remote-Konfiguration.
- Klicken Sie auf die Schaltfläche Konfiguration erstellen, um das Konfigurationsformular zu öffnen, und fügen Sie
seasonal_image_url
als Parameterschlüssel hinzu. - Klicken Sie auf Textzeile hinzufügen und geben Sie diese Beschreibung ein:
Shows a seasonal image (replaces default) in the main page when the restaurant list is empty.
- Klicken Sie auf Neu hinzufügen -> Bedingter Wert -> Neue Bedingung erstellen.
- Geben Sie als Bedingungsnamen
Seasonal image rollout
ein. - Wählen Sie für den Abschnitt
Applies if...
die OptionUser in random percentile <= 0%
aus. (Die Funktion sollte deaktiviert bleiben, bis Sie in einem späteren Schritt mit der Einführung beginnen.) - Klicken Sie auf Bedingung erstellen. Sie werden diese Bedingung später verwenden, um die neue Funktion für Ihre Nutzer einzuführen.
- Öffnen Sie das Formular zum Erstellen Ihres ersten Parameters und suchen Sie nach dem Feld Wert für die saisonale Bildveröffentlichung. Geben Sie die URL ein, unter der das saisonale Bild heruntergeladen werden soll:
https://images.unsplash.com/photo-1552691021-7043334e0b51
- Lassen Sie den Standardwert als leeren String. Das bedeutet, dass das Standardbild in der Codebasis angezeigt wird, anstatt ein Bild, das über eine URL heruntergeladen wurde.
- Klicken Sie auf Speichern.
Die neue Konfiguration wird als Entwurf erstellt.
- Klicken Sie auf Änderungen veröffentlichen und bestätigen Sie die Änderungen oben, um Ihre App zu aktualisieren.
5. Monitoring der Datenladezeit hinzufügen
Deine App lädt einige Daten vorab, bevor MainActivity
angezeigt wird, und zeigt einen Ladebildschirm an, um diesen Vorgang auszublenden. Nutzer sollen nicht zu lange auf diesem Bildschirm warten. Daher ist es normalerweise hilfreich zu prüfen, wie lange der Ladebildschirm angezeigt wird.
Firebase Performance Monitoring bietet eine Möglichkeit, genau das zu tun. Sie können benutzerdefinierte Code-Traces instrumentieren, um die Leistung bestimmter Codeabschnitte in Ihrer App zu überwachen, z. B. die Ladezeit für Daten und die Verarbeitungszeit Ihrer neuen Funktion.
Wenn Sie erfassen möchten, wie lange der Ladebildschirm angezeigt wird, fügen Sie SplashScreenActivity
ein benutzerdefiniertes Code-Trace hinzu. Das ist die Activity
, die den Ladebildschirm implementiert.
- Initialisieren, erstellen und starten Sie einen benutzerdefinierten Code-Trace mit dem Namen
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");
// ...
}
- Beenden Sie den Trace in der
onDestroy()
-Methode vonSplashScreenActivity
:
SplashScreenActivity.java
@Override
protected void onDestroy() {
super.onDestroy();
// TODO: Stop the splash_screen_trace here
splashScreenTrace.stop();
}
Da Ihre neue Funktion ein Bild herunterlädt und verarbeitet, fügen Sie einen zweiten benutzerdefinierten Code-Trace hinzu, mit dem die zusätzliche Zeit erfasst wird, die Ihre Funktion SplashScreenActivity
hinzugefügt hat.
- Initialisieren, erstellen und starten Sie einen benutzerdefinierten Code-Trace mit dem Namen
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");
// ...
}
}
- Beenden Sie die Aufzeichnung in den Methoden
onLoadFailed()
undonResourceReady()
derRequestListener
:
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();
Nachdem Sie benutzerdefinierte Code-Traces hinzugefügt haben, um die Dauer des Ladebildschirms (splash_screen_trace)
und die Verarbeitungszeit der neuen Funktion (splash_seasonal_image_processing
) zu erfassen), führen Sie die App noch einmal in Android Studio aus. Sie sollten eine Logging-Nachricht mit Logging trace metric: splash_screen_trace
und der Dauer der Trace-Daten sehen. Für splash_seasonal_image_processing
wird keine Protokollmeldung angezeigt, da Sie die neue Funktion noch nicht aktiviert haben.
6. Dem Trace ein benutzerdefiniertes Attribut hinzufügen
Bei benutzerdefinierten Code-Traces protokolliert Performance Monitoring automatisch Standardattribute (allgemeine Metadaten wie App-Version, Land, Gerät usw.), damit Sie die Daten für den Trace in der Firebase Console filtern können. Sie können auch benutzerdefinierte Attribute hinzufügen und überwachen.
Sie haben Ihrer App gerade zwei benutzerdefinierte Code-Traces hinzugefügt, um die Dauer des Splashscreens und die Verarbeitungszeit der neuen Funktion zu überwachen. Ein Faktor, der sich auf diese Dauer auswirken kann, ist, ob das angezeigte Bild das Standardbild ist oder ob das Bild von einer URL heruntergeladen werden muss. Und wer weiß, vielleicht haben Sie irgendwann verschiedene URLs, von denen Sie ein Bild herunterladen.
Fügen wir diesen benutzerdefinierten Code-Traces also ein benutzerdefiniertes Attribut hinzu, das die URL des saisonalen Bildes darstellt. So können Sie die Daten zur Dauer später nach diesen Werten filtern.
- Fügen Sie das benutzerdefinierte Attribut (
seasonal_image_url_attribute
) fürsplash_screen_trace
am Anfang derexecuteTasksBasedOnRC
-Methode hinzu:
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);
}
// ...
}
- Fügen Sie dasselbe benutzerdefinierte Attribut für
splash_seasonal_image_processing
direkt nach demstartTrace("splash_seasonal_image_processing")
-Aufruf hinzu:
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);
// ...
}
Nachdem Sie nun ein benutzerdefiniertes Attribut (seasonal_image_url_attribute
) für Ihre beiden benutzerdefinierten Traces (splash_screen_trace
und splash_seasonal_image_processing
) hinzugefügt haben, führen Sie die App noch einmal in Android Studio aus. Es sollte eine Logging-Meldung angezeigt werden, die Setting attribute 'seasonal_image_url_attribute' to 'unset' on trace 'splash_screen_trace'.
enthält. Sie haben den Remote Config-Parameter seasonalImageUrl noch nicht aktiviert. Deshalb lautet der Attributwert unset
.
Das Performance Monitoring SDK erfasst die Trace-Daten und sendet sie an Firebase. Sie können sich die Daten im Dashboard zur Leistungsüberwachung der Firebase Console ansehen. Das wird im nächsten Schritt des Codelabs ausführlich erläutert.
7. Dashboard zur Leistungsüberwachung konfigurieren
Dashboard für die Überwachung der Funktion konfigurieren
Wählen Sie in der Firebase Console das Projekt mit Ihrer Friendly Eats App aus.
Suchen Sie im linken Bereich die Option Release & Überwachen und dann auf Leistung.
Sie sollten nun das Dashboard Leistung mit Ihren ersten Datenpunkten auf dem Messwert-Board sehen. Das Performance Monitoring SDK erfasst Leistungsdaten aus Ihrer App und zeigt sie innerhalb weniger Minuten an.
Auf diesem Messwert-Dashboard können Sie wichtige Messwerte für Ihre App im Blick behalten. Die Standardansicht enthält die Dauer des Traces für die App-Startzeit. Sie können aber die Messwerte hinzufügen, die für Sie am wichtigsten sind. Da Sie die neue Funktion erfassen, können Sie Ihr Dashboard so anpassen, dass die Dauer des benutzerdefinierten Code-Traces splash_screen_trace
angezeigt wird.
- Klicken Sie auf eines der leeren Kästchen Messwert auswählen.
- Wählen Sie im Dialogfeld den Trace-Typ Benutzerdefinierte Traces und den Trace-Namen
splash_screen_trace
aus.
- Klicken Sie auf Messwert auswählen. Die Dauer von
splash_screen_trace
sollte jetzt Ihrem Dashboard hinzugefügt worden sein.
Mit denselben Schritten kannst du auch andere Messwerte hinzufügen, die dich interessieren, damit du schnell sehen kannst, wie sich ihre Leistung im Laufe der Zeit und sogar bei anderen Releases ändert.
Sie ist ein leistungsfähiges Tool, mit dem Sie die Leistung wichtiger Messwerte überprüfen können, die Ihre Nutzer sehen. In diesem Codelab haben Sie eine kleine Datenmenge in einem engen Zeitraum. Daher verwenden Sie andere Dashboard-Ansichten, die Ihnen helfen, die Leistung der Funktionseinführung zu verstehen.
8. Funktion einführen
Nachdem Sie das Monitoring eingerichtet haben, können Sie die Firebase Remote Config-Änderung (seasonal_image_url)
) einführen, die Sie zuvor eingerichtet haben.
Wenn Sie eine Änderung einführen möchten, kehren Sie in der Firebase Console zur Seite Remote Config zurück, um das Nutzerprozentil Ihrer Targeting-Bedingung zu erhöhen. Normalerweise führen Sie neue Funktionen für einen kleinen Teil der Nutzer ein und erhöhen die Anzahl nur, wenn Sie sicher sind, dass keine Probleme damit auftreten. In diesem Codelab sind Sie jedoch die einzigen Nutzer der App, sodass Sie das Perzentil auf 100 % ändern können.
- Klicken Sie oben auf der Seite auf den Tab Bedingungen.
- Klicken Sie auf die Bedingung
Seasonal image rollout
, die Sie zuvor hinzugefügt haben. - Ändern Sie das Perzentil in 100%.
- Klicken Sie auf Bedingung speichern.
- Klicken Sie auf Änderungen veröffentlichen und bestätigen Sie die Änderungen.
Starten Sie in Android Studio die App in Ihrem Emulator neu, um die neue Funktion zu sehen. Nach dem Startbildschirm sollte der neue Hauptbildschirm im leeren Zustand angezeigt werden.
9. Leistungsänderungen prüfen
Sehen wir uns nun im Dashboard zur Leistungsüberwachung in der Firebase Console die Leistung beim Laden des Ladebildschirms an. In diesem Schritt des Codelabs verwenden Sie verschiedene Bereiche des Dashboards, um sich Leistungsdaten anzusehen.
- Scrollen Sie auf dem Tab Dashboard nach unten zur Traces-Tabelle und klicken Sie dann auf den Tab Benutzerdefinierte Traces. In dieser Tabelle sehen Sie die benutzerdefinierten Code-Traces, die Sie zuvor hinzugefügt haben, sowie einige vordefinierte Traces.
- Nachdem Sie die neue Funktion aktiviert haben, suchen Sie nach dem benutzerdefinierten Code-Trace
splash_seasonal_image_processing
, mit dem die Zeit gemessen wurde, die zum Herunterladen und Verarbeiten des Bildes benötigt wurde. Aus dem Wert Duration (Dauer) des Tracings geht hervor, dass der Download und die Verarbeitung sehr viel Zeit in Anspruch nehmen.
- Da Sie Daten für
splash_seasonal_image_processing
haben, können Sie die Dauer dieses Segments oben auf dem Tab Dashboard Ihrem Messwertbereich hinzufügen.
Klicken Sie wie zuvor auf eines der leeren Kästchen Messwert auswählen. Wählen Sie im Dialogfeld den Trace-Typ Benutzerdefinierte Traces und den Trace-Namen splash_seasonal_image_processing
aus. Klicken Sie abschließend auf Messwert auswählen, um diesen Messwert dem Messwertfeld hinzuzufügen.
- Um die Unterschiede zu bestätigen, können Sie sich die Daten für
splash_screen_trace
genauer ansehen. Klicken Sie auf dem Messwert-Dashboard auf die Kartesplash_screen_trace
und dann auf Messwertdetails ansehen.
- Auf der Detailseite sehen Sie links unten eine Liste mit Attributen, darunter das zuvor erstellte benutzerdefinierte Attribut. Klicken Sie auf das benutzerdefinierte Attribut
seasonal_image_url_attribute
, um rechts die Dauer des Begrüßungsbildschirms für jede saisonale Bild-URL aufzurufen:
- Die Werte für die Dauer des Ladebildschirms werden wahrscheinlich etwas von denen im Screenshot oben abweichen, aber Sie sollten eine längere Dauer festlegen, wenn das Bild von einer URL heruntergeladen wird, als das Standardbild (dargestellt durch „nicht festgelegt“).
In diesem Codelab ist der Grund für diese längere Dauer möglicherweise offensichtlich, in einer echten App ist das aber möglicherweise nicht so klar. Die erhobenen Daten zur Dauer stammen von verschiedenen Geräten, auf denen die App unter verschiedenen Bedingungen mit der Netzwerkverbindung ausgeführt wird. Diese Bedingungen können schlechter als erwartet ausfallen. Sehen wir uns an, wie Sie dieses Problem untersuchen würden, wenn es sich um eine reale Situation handeln würde.
- Klicken Sie oben auf der Seite auf Leistung, um zum Haupttab Dashboard zurückzukehren:
- Klicken Sie in der Tabelle mit den Traces unten auf der Seite auf den Tab Netzwerkanfragen. In dieser Tabelle werden alle Netzwerkanfragen von Ihrer App in URL-Mustern zusammengefasst angezeigt, einschließlich des URL-Musters
images.unsplash.com/**
. Wenn Sie den Wert dieser Antwortzeit mit der Gesamtzeit vergleichen, die für den Download und die Verarbeitung des Bildes benötigt wird (d.h. die Dauer dessplash_seasonal_image_processing
-Trace), sehen Sie, dass ein großer Teil der Zeit für das Herunterladen des Bildes aufgewendet wird.
Leistungsergebnisse
Mit Firebase Performance Monitoring haben Sie festgestellt, dass die neue Funktion die folgenden Auswirkungen auf die Endnutzer hat:
- Die mit
SplashScreenActivity
verbrachte Zeit hat sich erhöht. - Die Dauer für
splash_seasonal_image_processing
war sehr lang. - Die Verzögerung ist auf die Antwortzeit für den Bilddownload und die entsprechende Verarbeitungszeit für das Bild zurückzuführen.
Im nächsten Schritt beheben Sie die Leistungseinbußen, indem Sie die Funktion rückgängig machen und herausfinden, wie Sie die Implementierung der Funktion verbessern können.
10. Rollback der Funktion durchführen
Die Wartezeit der Nutzer während des Startbildschirms sollte möglichst kurz sein. Einer der Hauptvorteile von Remote Config ist die Möglichkeit, das Roll-out zu pausieren und rückgängig zu machen, ohne eine weitere Version für Ihre Nutzer veröffentlichen zu müssen. So können Sie schnell auf Probleme reagieren (z. B. auf die Leistungsprobleme, die Sie im letzten Schritt festgestellt haben) und die Anzahl unzufriedener Nutzer minimieren.
Als schnelle Abhilfe setzen Sie das Prozentsatz-Limit für die Einführung auf 0
zurück, damit alle Nutzer wieder das Standardbild sehen:
- Kehren Sie in der Firebase Console zur Seite Remote Config zurück.
- Klicken Sie oben auf der Seite auf Bedingungen.
- Klicken Sie auf die Bedingung
Seasonal image rollout
, die Sie zuvor hinzugefügt haben. - Ändern Sie den Prozentrang in 0 %.
- Klicken Sie auf Bedingung speichern.
- Klicken Sie auf Änderungen veröffentlichen und bestätigen Sie die Änderungen.
Starten Sie die App in Android Studio neu. Jetzt sollten Sie den leeren Hauptbildschirm sehen:
11. Leistungsprobleme beheben
Sie haben bereits festgestellt, dass das Herunterladen eines Bilds für den Ladebildschirm zu einer Verlangsamung Ihrer App geführt hat. Bei genauerer Betrachtung des heruntergeladenen Bilds stellen Sie fest, dass Sie die ursprüngliche Auflösung des Bilds verwenden, die über 2 MB beträgt. Eine schnelle Lösung für Ihr Leistungsproblem besteht darin, die Qualität auf eine geeignetere Auflösung zu reduzieren, damit das Bild schneller heruntergeladen werden kann.
Remote Config-Wert noch einmal bereitstellen
- Kehren Sie in der Firebase Console zur Seite Remote Config zurück.
- Klicken Sie für den Parameter
seasonal_image_url
auf das Symbol Bearbeiten. - Ändern Sie den Wert für das saisonale Roll-out von Bildern in
https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640
und klicken Sie dann auf Speichern.
- Klicken Sie oben auf der Seite auf den Tab Bedingungen.
- Klicken Sie auf Einführung saisonaler Bilder und setzen Sie den Prozentsatz wieder auf 100 %.
- Klicken Sie auf Bedingung speichern.
- Klicken Sie auf die Schaltfläche Änderungen veröffentlichen.
12. Behebung testen und Benachrichtigungen einrichten
App lokal ausführen
Führen Sie die App noch einmal aus, nachdem Sie als neuen Konfigurationswert eine andere URL zum Herunterladen des Bilds festgelegt haben. Dieses Mal sollten Sie feststellen, dass der Ladebildschirm kürzer als zuvor ist.
Leistung der Änderungen prüfen
Kehren Sie in der Firebase Console zum Dashboard „Leistung“ zurück, um sich die Messwerte anzusehen.
- Dieses Mal verwenden Sie die Traces-Tabelle, um die Detailseite aufzurufen. Klicken Sie unten in der Trace-Tabelle auf dem Tab Benutzerdefinierte Traces auf das benutzerdefinierte Trace
splash_seasonal_image_processing
, um eine detailliertere Ansicht des Messwerts für die Dauer aufzurufen.
- Klicken Sie auf das benutzerdefinierte Attribut
seasonal_image_url_attribute
, um die Aufschlüsselung der benutzerdefinierten Attribute noch einmal aufzurufen. Wenn Sie den Mauszeiger auf die URLs bewegen, sehen Sie einen Wert, der mit der neuen URL für das Bild in reduzierter Größe übereinstimmt:https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640
(mit dem?w=640
am Ende). Der mit diesem Bild verknüpfte Wert für die Dauer ist deutlich kürzer als der Wert für das vorherige Bild und für Ihre Nutzer akzeptabel.
- Nachdem Sie die Leistung des Ladebildschirms verbessert haben, können Sie jetzt Benachrichtigungen einrichten, um informiert zu werden, wenn ein Trace einen von Ihnen festgelegten Grenzwert überschreitet. Öffnen Sie das Dashboard Leistung und klicken Sie auf das Dreipunkt-Menü für splash_screen_trace und dann auf Benachrichtigungseinstellungen.
- Klicken Sie auf die Ein/Aus-Schaltfläche, um die Benachrichtigung Dauer zu aktivieren. Legen Sie den Grenzwert etwas über dem Wert fest, den Sie bisher gesehen haben, damit Sie eine E-Mail erhalten, wenn der Wert für splash_screen_trace den Grenzwert überschreitet.
- Klicken Sie auf Speichern, um die Benachrichtigung zu erstellen. Scrollen Sie nach unten zur Trace-Tabelle und klicken Sie auf den Tab Benutzerdefinierte Traces, um zu prüfen, ob Ihre Benachrichtigung aktiviert ist.
13. Glückwunsch!
Glückwunsch! Sie haben das Firebase Performance Monitoring SDK aktiviert und Traces erfasst, um die Leistung einer neuen Funktion zu messen. Sie haben wichtige Leistungsmesswerte für die Einführung einer neuen Funktion beobachtet und schnell reagiert, als ein Leistungsproblem festgestellt wurde. All dies war möglich, da wir Konfigurationsänderungen mit Remote Config vornehmen und in Echtzeit auf Leistungsprobleme überwachen konnten.
Behandelte Themen
- Firebase Performance Monitoring SDK in Ihre App einbinden
- Code einen benutzerdefinierten Code-Trace hinzufügen, um eine bestimmte Funktion zu messen
- Remote Config-Parameter und einen bedingten Wert zur Steuerung/Einführung einer neuen Funktion einrichten
- Verwendung des Dashboards zur Leistungsüberwachung zur Identifizierung von Problemen während eines Roll-outs
- Richten Sie Leistungsbenachrichtigungen ein, damit Sie informiert werden, wenn die Leistung Ihrer App einen von Ihnen festgelegten Grenzwert überschreitet