Die Arbeit mit Bildern kann schnell zu Leistungsproblemen führen, wenn
vorsichtig sein. Sie können bei der Arbeit ganz leicht auf ein OutOfMemoryError
stoßen.
mit großen Bitmaps. Mit diesen Best Practices sorgst du dafür, dass deine App
von seiner besten Seite.
Laden Sie nur die Bitmap-Größe, die Sie benötigen.
Die meisten Smartphones haben Kameras mit hoher Auflösung, die große Bilddateien erstellen. Wenn Sie ein Bild auf dem Bildschirm zeigen, müssen Sie entweder die Auflösung des Image hochladen oder das Image nur bis zur Größe des Image-Containers laden. Die ständiges Laden größerer Bilder als erforderlich kann die GPU-Caches erschöpfen, weniger leistungsstarkes UI-Rendering.
So verwalten Sie die Bildgrößen:
- Ihre Bilddateien so klein wie möglich verkleinern, ohne dass dies Auswirkungen auf Ausgabebild).
- Konvertieren Sie Ihre Bilder in das WEBP-Format anstelle von JPEG oder PNG.
- Stellen Sie kleinere Bilder für unterschiedliche Bildschirmauflösungen zur Verfügung (siehe Tipp 3).
- Verwenden Sie eine Bibliothek zum Laden von Bildern, die Ihr Bild an die die Größe Ihrer Ansicht auf dem Bildschirm. Dies kann dazu beitragen, die Ladeleistung der Bildschirm.
Verwenden Sie nach Möglichkeit Vektoren über Bitmaps.
Wenn Sie etwas auf dem Bildschirm visuell darstellen, müssen Sie entscheiden, ob es als Vektor dargestellt werden oder nicht. Bevorzugen Sie Vektorbilder gegenüber Bitmaps, da sie verpixeln nicht, wenn sie auf verschiedene Größen skaliert werden. Allerdings ist nicht immer alles Sie können als Vektor dargestellt werden. Mit einer Kamera aufgenommene Bilder können nicht konvertiert werden. in einen Vektor umgewandelt werden.
Stellen Sie alternative Ressourcen für unterschiedliche Bildschirmgrößen bereit
Wenn Sie mit Ihrer App Bilder versenden, sollten Sie erwägen, Bilder in unterschiedlichen Größen zu liefern. Assets für unterschiedliche Geräteauflösungen. So lässt sich die Downloadgröße reduzieren und die Leistung verbessert, da sie mit einer geringeren auf einem Gerät mit geringerer Auflösung. Weitere Informationen zur Bereitstellung Bitmaps für unterschiedliche Gerätegrößen finden Sie Bitmap-Dokumentation.
Beim Verwenden von ImageBitmap
vor dem Zeichnen prepareToDraw
aufrufen
Wenn Sie ImageBitmap
verwenden, wird der Upload der Textur in den
GPU: Rufen Sie ImageBitmap#prepareToDraw()
auf, bevor Sie es tatsächlich zeichnen. Dieses
hilft der GPU bei der Vorbereitung der Textur und beim Verbessern der Leistung bei der Darstellung eines
visuelle Elemente auf dem Bildschirm. Die meisten Bibliotheken zum Laden von Bildern führen
diese Optimierung bereits durch, aber
Wenn Sie selbst mit der Klasse ImageBitmap
arbeiten, können Sie
die Sie bedenken sollten.
Übergeben Sie lieber ein Int
-DrawableRes
oder eine URL als Parameter an die zusammensetzbare Funktion statt Painter
.
Aufgrund der Komplexität des Umgangs mit Bildern (z. B. das Schreiben eines Gleichheitszeichens
für Bitmaps
rechenintensiv wäre), ist die Painter
API
nicht als Stabile Klasse gekennzeichnet. Instabile Klassen können
zu unnötigen Neuzusammensetzungen führen, da der Compiler nicht einfach ableiten kann, ob
wenn sich die Daten geändert haben.
Daher ist es besser, eine URL oder Drawable-Ressourcen-ID als Parameter zu übergeben.
in die zusammensetzbare Funktion, anstatt Painter
als Parameter zu übergeben.
// Prefer this:
@Composable
fun MyImage(url: String) {
}
// Over this:
@Composable
fun MyImage(painter: Painter) {
}
Bitmap nicht länger im Arbeitsspeicher speichern, als nötig ist
Je mehr Bitmaps Sie in den Arbeitsspeicher laden, desto wahrscheinlicher ist es,
nicht genügend Arbeitsspeicher auf dem Gerät. Wenn Sie z. B. eine umfangreiche Liste von
zusammensetzbaren Funktionen auf dem Bildschirm verwenden,
können Sie mit LazyColumn
oder LazyRow
dafür sorgen,
beim Scrollen durch eine große Liste.
Große Bilder nicht mit der AAB-/APK-Datei verpacken
Eine der Hauptursachen für eine große App-Downloadgröße ist, dass die Grafiken die in der AAB- oder APK-Datei gepackt sind. Verwende das APK Analyzer-Tool, um sicherzustellen, Sie verpacken nicht die erforderlichen Bilddateien. Reduzieren Sie die Größe oder die Bilder auf einen Server zu stellen und nur bei Bedarf herunterzuladen.
Empfehlungen für dich
- Hinweis: Der Linktext wird angezeigt, wenn JavaScript deaktiviert ist.
- ImageBitmap vs. ImageVector {:#bitmap-vs-vector}
- UI-Status in „Compose“ speichern
- Jetpack-Compose-Phasen