Auf dieser Seite wird erklärt, was Overdraw ist, wie Sie es diagnostizieren und wie Sie es vermeiden oder reduzieren können.
Wenn eine App dasselbe Pixel innerhalb eines einzelnen Frames mehrmals zeichnet, wird dies als Overdraw bezeichnet. Overdraw ist in der Regel unnötig und sollte vermieden werden. Overdraw wird zu einem Leistungsproblem, wenn GPU-Zeit für das Rendern von Pixeln verschwendet wird, die nicht zu dem beitragen, was der Nutzer auf dem Bildschirm sieht.
Overdraw
Overdraw bedeutet, dass das System ein Pixel in einem einzelnen Frame des Renderings mehrmals auf dem Bildschirm zeichnet. Wenn Sie beispielsweise einen Stapel von UI-Karten haben, verdeckt jede Karte einen Teil der darunter liegenden Karte. Das System muss jedoch weiterhin die verdeckten Teile der Karten im Stapel zeichnen. Das liegt daran, dass gestapelte Karten gemäß dem Maler-Algorithmus gerendert werden, d. h. in der Reihenfolge von hinten nach vorne. Durch diese Renderingreihenfolge kann das System transparente Objekte wie Schatten richtig mit Alpha-Blending versehen.
Überschneidungsprobleme finden
Die Plattform bietet die folgenden Tools, mit denen Sie feststellen können, ob Overdraw die Leistung Ihrer App beeinträchtigt.
Tool „GPU-Overdraw debuggen“
Das Tool „GPU-Overdraw debuggen“ verwendet Farbcodierung, um die Anzahl der Male anzugeben, die Ihre App jedes Pixel auf dem Bildschirm zeichnet. Je höher diese Anzahl ist, desto wahrscheinlicher ist es, dass Overdraw die Leistung Ihrer App beeinträchtigt.
Weitere Informationen finden Sie unter GPU-Überschneidung visualisieren.
Tool „GPU-Rendering für Profil“
Das Tool „GPU-Rendering für Profil“ zeigt die Zeit an, die jede Phase der Renderingpipeline benötigt, um einen einzelnen Frame als scrollendes Histogramm anzuzeigen. Der Teil Prozess jeder Leiste, der orange dargestellt ist, zeigt an, wann das System Puffer austauscht. Dieser Messwert liefert wichtige Hinweise auf Overdraw.
Bei weniger leistungsstarken GPUs kann die verfügbare Füllrate – die Geschwindigkeit, mit der die GPU den Framepuffer füllen kann – niedrig sein. Wenn die Anzahl der Pixel, die zum Zeichnen eines Frames erforderlich sind, steigt, benötigt die GPU möglicherweise mehr Zeit, um neue Befehle zu verarbeiten, und fordert den Rest des Systems auf, zu warten, bis sie aufgeholt hat. Die Leiste Prozess zeigt diesen Anstieg, wenn die GPU überlastet ist und versucht, Pixel so schnell wie möglich zu zeichnen. Auch andere Probleme als die reine Anzahl der Pixel können dazu führen, dass dieser Messwert ansteigt. Wenn das Tool „GPU-Overdraw debuggen“ beispielsweise starken Overdraw anzeigt und Prozess ansteigt, liegt wahrscheinlich ein Problem mit Overdraw vor.
Weitere Informationen finden Sie unter GPU-Renderinggeschwindigkeit für Profil.
Overdraw beheben
Sie können Folgendes tun, um Overdraw zu reduzieren oder zu vermeiden:
- Entfernen Sie unnötige Hintergründe in Layouts.
- Reduzieren Sie die Transparenz.
In diesem Abschnitt finden Sie Informationen zu beiden Ansätzen.
Unnötige Hintergründe in Layouts entfernen
Standardmäßig hat ein Layout keinen Hintergrund. Das bedeutet, dass es nichts direkt selbst rendert. Wenn Layouts jedoch Hintergründe haben, können sie zu Overdraw beitragen.
Sie können die Renderingleistung verbessern, indem Sie unnötige Hintergründe entfernen, z. B. einen Hintergrund, der nicht sichtbar ist, weil er vollständig von allem verdeckt wird, was die App darüber zeichnet. Beispielsweise kann ein untergeordnetes Box oder ein Layout
mit einem .background Modifikator den Hintergrund eines übergeordneten Containers
vollständig verdecken, sodass der Zeichenvorgang des übergeordneten Elements für den Nutzer nicht sichtbar ist
aber dennoch vollständig von der GPU verarbeitet wird.
Um herauszufinden, warum Sie Overdraw haben, sehen Sie sich die Komponentenhierarchie im Layout Inspector-Tool an. Sie können nach Hintergründen suchen, die für den Nutzer nicht sichtbar sind, und sie entfernen. Sie können auch unnötige Hintergründe entfernen, wenn mehrere Container dieselbe Hintergrundfarbe haben. Legen Sie den Fensterhintergrund auf die Haupt-Hintergrundfarbe Ihrer App fest und lassen Sie alle Container darüber ohne definierte Hintergrundwerte.
Transparenz reduzieren
Das Rendern transparenter Pixel auf dem Bildschirm, auch Alpha-Rendering genannt, trägt maßgeblich zu Overdraw bei. Im Gegensatz zu Standard-Overdraw, bei dem das System vorhandene gezeichnete Pixel vollständig verdeckt, indem es undurchsichtige Pixel darüber zeichnet, müssen transparente Objekte zuerst vorhandene Pixel zeichnen, damit die richtige Mischgleichung angewendet werden kann.
Visuelle Effekte wie transparente Animationen, Ausblendungen und Schlagschatten enthalten etwas Transparenz und können daher erheblich zu Overdraw beitragen. Sie können Overdraw in diesen Situationen verbessern, indem Sie die Anzahl der transparenten Objekte reduzieren, die Sie rendern. Sie können beispielsweise grauen Text erhalten, indem Sie schwarzen Text in
einem Text-Composable zeichnen und einen durchscheinenden Alphawert mit modifier
= Modifier.alpha(0.5f) anwenden. Sie können jedoch denselben Effekt mit besserer Leistung erzielen, indem Sie die Textfarbe des Composables direkt auf ein undurchsichtiges Grau setzen: color = Color.Black.copy(alpha = 0.5f).
Weitere Informationen zu den Leistungskosten, die Transparenz in der gesamten Zeichenpipeline verursacht, finden Sie unter Hidden Costs of Transparency.