Analysieren der UI-Reaktionsfähigkeit in Store-Apps (XAML)

Mit dem XAML-UI-Reaktionsfähigkeit-Profiler für Store-Apps können Sie Leistungsprobleme suchen und beheben, die sich auf die Verarbeitung und das Rendering von XAML beziehen. Lange Start- und Navigationszeiten, unregelmäßiges Schwenken und unregelmäßiger Bildlauf sowie Verzögerungen bei der Verarbeitung von Benutzereingaben sind einige der Probleme, die Sie mit dem Tool analysieren können.

Hinweis

Zusammen mit den Daten über die XAML-UI-Reaktionsfähigkeit können Sie auch Daten zur CPU-Auslastung und zum Energieverbrauch erfassen und analysieren.Weitere Informationen finden Sie unter Ausführen von Analysetools über die Seite "Leistung und Diagnose"

Inhalt

Identifizieren von Szenarien mit Benutzermarkierungen

Erfassen von Daten für die UI-Reaktionsfähigkeit für die App

Erfassen von Daten für die UI-Reaktionsfähigkeit für eine Installierte App

Analysieren der Benutzeroberflächen-Reaktionsfähigkeits-Daten

Optimieren der XAML-Reaktionsfähigkeit

Identifizieren von Szenarien mit Benutzermarkierungen

Sie können den Profilerstellungsdaten Benutzermarkierungen hinzufügen, die bei der Identifizierung von Bereichen im Zeitachsenlineal hilfreich sind.

Die Markierung wird bei Ausführung der Methode in der Zeitachse als orangefarbenes Dreieck angezeigt. Die Meldung und die Uhrzeit werden als QuickInfo angezeigt, wenn Sie auf die Markierung zeigen. Wenn mindestens zwei Benutzermarkierungen nahe beieinander liegen, werden die Markierungen zusammengeführt und die QuickInfo-Daten werden kombiniert. Sie können auf der Zeitachse eine Vergrößerung durchführen, um die Markierungen zu trennen.

Um C#-, Visual Basic- und C++-Code eine Benutzermarkierung hinzuzufügen, erstellen Sie zuerst ein Windows.Foundation.Diagnostics LoggingChannel-Objekt. Fügen Sie anschließend an den Positionen im Code, die Sie markieren möchten, Aufrufe von LoggingChannel.LogMessage-Methoden ein. Verwenden Sie in den Aufrufen LoggingLevel.Information.

Wenn die Methode beendet wird, wird den Profilerstellungsdaten eine Benutzermarkierung und eine Meldung hinzugefügt.

Hinweis

• Windows.Foundation.Diagnostics.LoggingChannel implementiert die Windows.Foundation.IClosable-Schnittstelle (in C# und VB als System.IDisposable projiziert). Um Verluste von Betriebssystemressourcen zu vermeiden, rufen Sie Dispose() auf, wenn Sie mit einem Protokollierungskanal fertig sind.

• Jeder offene Protokollierungskanal muss einen eindeutigen Namen haben.Der Versuch, einen neuen Protokollierungskanal zu erstellen, der denselben Namen wie ein nicht freigegebener Kanal hat, löst eine Ausnahme aus.

Beispiele finden Sie im Windows SDK-Beispiel LoggingSession Sample.

Erfassen von Daten für die UI-Reaktionsfähigkeit für die App

Sie können ein Profil der Antwortzeiten der App auf dem Visual Studio-Gerät, dem Visual Studio-Simulator oder den Visual Studio-Emulatoren oder auf einem Remotegerät erstellen. Weitere Informationen finden Sie unter Ausführen von Store-Apps aus Visual Studio. Die erforderlichen Schritte werden hier aufgeführt:

1. Wählen Sie auf der Debugger-Symbolleiste Standard neben der Schaltfläche Debuggen starten aus der Dropdownliste den Ort aus, an dem die App im Simulator ausgeführt werden soll.

   

2. Wenn Sie ein Profil auf einem Tablet oder PC erstellen, der nicht das gleiche wie der Visual Studio-Computer ist, konfigurieren Sie das Projekt für die Remoteprofilerstellung. Weitere Informationen finden Sie unter Ausführen von Windows Store-Apps auf einem Remotecomputer in Visual Studio

3. Wählen Sie im Menü Debuggen die Option Leistung und Diagnose aus.

   

4. Wählen Sie XAML-Benutzeroberflächen-Reaktionsfähigkeit aus, und wählen Sie dann Starten aus.

   Hinweis

   Beim Start des Profilers XAML-UI-Reaktionsfähigkeit wird möglicherweise ein Fenster "Benutzerkontensteuerung" die Berechtigung zum Ausführen der Datei "VsEtwCollector.exe" abfragen.Klicken Sie auf Ja.

5. Führen Sie die App aus, um Daten zu erfassen.

   Tipp

   Führen Sie die App direkt auf dem Gerät aus.Die Anwendungsleistung, die im Simulator oder über eine Remotedesktopverbindung festgestellt wird, ist nicht unbedingt ein Hinweis auf die tatsächliche Leistung auf einem Gerät.

6. Um die Profilerstellung zu beenden, wechseln Sie zu Visual Studio zurück (ALT+TAB), und wählen Sie Auflistung beenden auf der Seite Leistung und Diagnose aus.

   

   Visual Studio analysiert die erfassten Daten und zeigt die Ergebnisse an.

   

Erfassen von Daten für die UI-Reaktionsfähigkeit für eine Installierte App

Der Profiler XAML-UI-Reaktionsfähigkeit kann nur auf Windows Store 8.1-Apps ausgeführt werden, die aus einer Visual Studio-Projektmappe heraus gestartet werden oder die vom Windows Store installiert werden. Wenn eine Projektmappe in Visual Studio geöffnet ist, ist das Startprojekt das Standardziel. Sie können ein Profil der XAML-Reaktionsfähigkeit für eine installierte App auf der lokalen oder auf einem Remotegerät ohne eine geöffnete Projektmappe erstellen.

Um auf eine installierte App auszurichten, gehen Sie wie folgt vor:

1. Wählen Sie Ziel ändern und dann Installierte App aus.

   

2. Remoteprofilerstellung. Um den XAML-Reaktionsfähigkeitsprofiler auf einem Remotegerät auszuführen, müssen die Visual Studio-Remotetools auf dem Gerät installiert und aktiv sein. Weitere Informationen finden Sie unter Ausführen von Windows Store-Apps auf einem Remotecomputer in Visual Studio.

   Wählen Sie im Dialogfeld Installiertes App-Paket auswählen die Option Remotecomputer aus und geben das Remotegerät an.

   

3. Wählen Sie in der Liste App-Pakete für die aktuelle Sitzung installiert die Ziel-App aus.

   

4. Wählen Sie auf der Seite "Leistung und Diagnose" die Option XAML-UI-Reaktionsfähigkeit aus.

5. Wählen Sie Starten aus, um mit der Profilerstellung zu beginnen.

Um die Profilerstellung zu beenden, wechseln Sie zu Visual Studio zurück (ALT+TAB), und wählen Sie Auflistung beenden auf der Diagnosehubseite aus.

Analysieren der Benutzeroberflächen-Reaktionsfähigkeits-Daten

Diagnostic session timeline**|UI Thread utilization|Visual throughput (FPS)|Parsing view|**Hot Elements view

Wenn Sie die Profilerstellungsdaten erfasst haben, können Sie diese Schritte ausführen, um die Analyse zu starten:

1. Überprüfen Sie die Informationen in den Diagrammen UI-Thread-Auslastung und Visueller Durchsatz (FPS), und wählen Sie anschließend mit den Zeitachsennavigationsleisten einen Zeitraum aus, den Sie analysieren möchten.

2. Überprüfen Sie anhand der Informationen in den Diagrammen UI-Thread-Auslastung oder Visueller Durchsatz (FPS) die Details in den Ansichten Analysieren oder Hot-Elemente, um mögliche Ursachen für jeden offensichtlichen Mangel an Reaktionsfähigkeit zu ermitteln.

Zeitachse für die Diagnosesitzung

Das Lineal am Anfang der Seite Leistung und Diagnose zeigt die Zeitachse für profilierte Informationen an. Diese Zeitachse gilt sowohl für das Diagramm für die UI-Thread-Auslastung als auch für das Diagramm für den Visuellen Durchsatz. Sie können den Bereich des Berichtes eingrenzen, indem Sie die Navigationsleisten auf der Zeitachse ziehen, um ein Segment der Zeitachse auszuwählen.

Die Zeitachse zeigt auch alle von Ihnen eingefügten Benutzermarkierungen und die Ereignisse des Aktivierungslebenszyklus der App an.

UI-Thread-Auslastung

Im Diagramm Auslastung des UI-Threads (%) wird die relative Zeit angegeben, die im UI-Thread für diese Kategorien aufgewendet wird:

Analyse	Gibt die Zeit an, die im UI-Thread für die XAML-Analyse und den Abruf von App-Ressourcen aufgewendet wird.
Layout	Gibt die Zeit an, die im UI-Thread für die Anordnung von XAML-Elementen aufgewendet wird.
App_Code	Gibt die Zeit an, die im UI-Thread auf das Ausführen von Anwendungs(benutzer)code verwendet wird, der weder mit dem Analysieren noch mit dem Layout in Verbindung steht.
Anderes XAML	Gibt die Zeit an, die im UI-Thread für die Ausführung von XAML-Laufzeitcode aufgewendet wird.

Visueller Durchsatz (F/s)

Im Liniendiagramm Visueller Durchsatz (FPS) werden die Frames pro Sekunde (FPS) auf der Benutzeroberfläche und dem Kompositionsthread der App dargestellt. Die Werte geben wieder, was Sie im Chrom einer App finden werden, wenn EnableFrameRateCounter aktiviert ist.

Analysieren der Ansicht

Die Ansicht Analyse enthält ein horizontales Balkendiagramm der XAML-Dateien, die im ausgewählten Bereich der Zeitachse geladen und verarbeitet werden. Die untergeordneten Elemente eines XAML-Dateiknotens sind Dateien, die von der Knotendatei eingeschlossen sind. Knoten werden in der Reihenfolge aufgelistet, in der sie geladen wurden. Im Bereich mit den Details werden diese Werte für eine ausgewählte Datei angezeigt.

Inklusive und exklusive Werte

Dauer, exklusiv	Die Zeit, die für die Verarbeitung der explizit in diesem Knoten definierten Elemente erforderlich ist.
Dauer, inklusiv	Die Zeit, die für die Verarbeitung der in diesem Knoten und allen untergeordneten Knoten definierten Elemente erforderlich ist.
Benutzeroberflächenelemente (exklusiv)	Die Anzahl von Elementen, die explizit in diesem Knoten definiert sind.
Benutzeroberflächenelemente (inklusiv)	Die Anzahl von Elementen, die explizit in diesem Knoten und allen untergeordneten Knoten definiert sind.

Ansicht „Hot Elements“

Die Ansicht Hot Elements enthält ein horizontales Balkendiagramm, das alle Elemente darstellt, die im ausgewählten Bereich auf der Zeitachse im Layout enthalten sind. Die Elemente werden nach der entsprechenden Vorlage gruppiert und nach der für das Layout erforderlichen Zeit in absteigender Reihenfolge sortiert.

Die untergeordneten Elemente eines Elementknotens sind die Elemente, die im Element des übergeordneten Knotens enthalten sind. Untergeordnete Knoten werden auch entsprechend ihrer Layoutzeit sortiert. In der Detailansicht werden Namens- und Zeitwert für ein ausgewähltes Element angezeigt.

Optimieren der XAML-Reaktionsfähigkeit

In den Themen in Performance best practices for Windows Store apps using C++, C#, and Visual Basic finden Sie die Informationen zur Optimierung der Leistung Ihrer App.

Im Folgenden sind einige Anregungen zum Optimieren der XAML-Leistung aufgeführt:

Optimieren von Start- und Seitennavigation

Sie können Start- und Seitennavigation der App beschleunigen, indem Sie die XAML-, Ressourcen- und Datendateien sorgfältig überprüfen, die auf die Seiten geladen werden. Ihre App kann langsam werden, wenn die XAML-Dateien eine große Anzahl von Benutzeroberflächenelementen erstellen oder darauf verweisen, die beim ersten Laden der Seite nicht erforderlich sind, wenn Ressourcendateien geladen werden, die auf Vorlagen und Formatvorlagen verweisen, die auf der aktuellen Seite nicht anwendbar sind, oder wenn dieselbe XAML- oder Ressourcendatei mehrmals geladen wird. In den folgenden Themen finden Sie Informationen zu Techniken, mit denen diese Probleme behoben werden können:

• Optimize loading XAML (Windows Store apps using C#/VB/C++ and XAML)

• Minimize startup time (Windows Store apps using C#/VB/C++ and XAML)

• Access the file system efficiently (Windows Store apps using C#/VB/C++ and XAML)

Optimieren von Schwenken und Bildlauf

Leistungsprobleme beim Schwenken und beim Bildlauf können verursacht werden, wenn kein Virtualisierungscontainer, keine großen und komplexen Vorlagen oder keine ineffizienten Algorithmen in benutzerdefinierten Pro-Frame-Rückrufmethoden verwendet werden. In den folgenden Themen finden Sie Informationen zu Techniken, mit denen diese Probleme behoben werden können:

• Load, store, and display large sets of data efficiently (Windows Store apps using C#/VB/C++ and XAML)

• Make animations smooth (Windows Store apps using C#/VB/C++ and XAML)

Optimieren der Eingabereaktionsfähigkeit

Techniken zur Behebung dieser Problemen finden Sie unter Keep the UI thread responsive (Windows Store apps using C#/VB/C++ and XAML).