Fehler in Animationen beheben

Eines der schwierigsten Probleme für App-Entwickler ist die Erstellung flüssiger, fehlerfreier Animationen. Das kann besonders schwer zu debuggen sein, wenn das System auch ressourcenintensive Hintergrundaufgaben ausführt. Es kann schwierig sein, festzustellen, ob ein Glitch durch Ihre App oder das System verursacht wird. Mit einem Profiler-Tool können Sie jedoch die mögliche Quelle des unerwünschten Verhaltens ermitteln.

Rendern unter ChromeOS

Eine fein abgestimmte App, z. B. ein Spiel, verwendet in der Regel Double Buffering, um die Reaktionszeit des Nutzers so gering wie möglich zu halten. Dennoch kann die Leistung durch viele Faktoren beeinträchtigt werden. Wenn das Rendern eines Frames beispielsweise zu lange dauert, ist das gerenderte Ergebnis nicht für den nächsten Pufferwechsel bereit und der vorherige Frame wird wiederholt.

Der Renderer kann dann nicht mit dem Rendern des nächsten Frames beginnen, was zu noch mehr Problemen führt. Dieses Szenario ist Android-Entwicklern vertraut. Wenn eine App unter ChromeOS ausgeführt wird, ist der Kontext noch komplizierter.

Eine auf dem Desktop ausgeführte App wird nicht direkt im Displayrahmen des Bildschirms gerendert. Stattdessen werden die Daten in einer Textur gerendert. In der Regel gibt es mehrere Apps, die ihre Grafiken jeweils in eine Textur rendern. Das System erstellt die Ansicht auf dem Bildschirm mithilfe eines Compositors, der alle Texturen zu einem einzigen Desktopbild kombiniert.

Der Compositor arbeitet transparent im Hintergrund, führt aber zu einer Zeitverzögerung von einem Frame, um die Nutzung der GPU-Pipeline zu maximieren. Diese Verzögerung gleicht Schwankungen der Systemleistung aus und trägt dazu bei, eine asymmetrische Last auszugleichen.

Wenn das Betriebssystem stark beansprucht wird, kann es zu Engpässen bei der GPU kommen. Dadurch kann es zu einer Verzögerung zwischen dem Rendern eines Frames und dem Erscheinen auf dem Bildschirm kommen. Je nach Hardware kann das System zur Kompensation ein Quadruple-Buffering verwenden. Auch bei einer tieferen Pufferung kann es in der Grafikpipeline zu Glitches kommen.

ARC-Grafik-Tracer

ChromeOS hat ein Profiling-Tool, das zeigt, wie die Puffer durch das System sickern, wann Speicherauslagerungen auftreten, wie stark die CPU/GPU ausgelastet ist und was Ihre Anwendung zu einem bestimmten Zeitpunkt tut. Das folgende Bild zeigt ein Beispiel:

Die ARC Graphics Tracer-Benutzeroberfläche mit Zeitachsen für Systemprozesse.
Abbildung 1. Die Benutzeroberfläche des ARC-Grafik-Tracers mit Zeitachsen für Systemprozesse.

Profiler einrichten

Sie müssen M75 oder höher ausführen, um den Profiler verwenden zu können. Die besten Ergebnisse erzielst du mit einem Intel-Gerät.

Bevor Sie den Profiler verwenden, sollten Sie Ihrer App Traces hinzufügen. Fügen Sie Trace.traceCounter(Trace.TRACE_TAG_GRAPHICS, "Event", <number>); an den Stellen in Ihrem Code ein, an denen Sie einen Trace einfügen möchten. Verwenden Sie ein Event, das mit dem Präfix customTrace beginnt. Das Präfix wird in der Trace-Meldung nicht angezeigt.

So richten Sie den Profiler ein:

  1. Aktivieren Sie den Entwicklermodus.
  2. Aktivieren Sie die Chrome-Einstellungen und das Tool zur Visualisierung von ARC-Grafikpuffern.
  3. Zu chrome://arc-graphics-tracing navigieren

Profiler ausführen

  1. Wählen Sie Bei Glitch anhalten aus.
  2. Führen Sie die Android-App aus.
  3. Wenn die Android-App aktiv ist und den Fokus hat, drücken Sie Control + Shift + G.

Wenn ein Glitch auftritt, wird ein Browserfenster geöffnet. Mit den Tasten W und S können Sie die Zeitleiste vergrößern und verkleinern.