Ottimizzare il rendimento delle immagini

Se non ti interessa, l'utilizzo delle immagini può introdurre rapidamente problemi di prestazioni. Puoi riscontrare facilmente un OutOfMemoryError quando lavori con bitmap di grandi dimensioni. Segui queste best practice per assicurarti che la tua app funzioni al meglio.

Carica solo le dimensioni del bitmap necessarie

La maggior parte degli smartphone dispone di fotocamere ad alta risoluzione che producono file immagine di grandi dimensioni. Se mostri un'immagine sullo schermo, devi ridurre la risoluzione dell'immagine o caricarla solo fino alle dimensioni del contenitore dell'immagine. Il caricamento costante di immagini più grandi del necessario può esaurire le cache della GPU, con conseguente rendering dell'interfaccia utente meno efficiente.

Per gestire le dimensioni delle immagini:

• Fai lo scale down dei file immagine in modo che sia il più piccolo possibile (senza influire sull'immagine di output).
• Valuta la possibilità di convertire le immagini in formato WEBP anziché JPEG o PNG.
• Fornisci immagini più piccole per risoluzioni dello schermo diverse (vedi suggerimento 3),
• Utilizza una libreria di caricamento delle immagini, che riduce le dimensioni dell'immagine in modo che si adatti alle dimensioni della visualizzazione sullo schermo. In questo modo, puoi migliorare le prestazioni di caricamento dello schermo.

Attenzione: l'utilizzo di painterResource non ridimensiona l'immagine in base alle dimensioni del Composable visibile sullo schermo. Se hai un'immagine di grandi dimensioni in una composizione di piccole dimensioni, assicurati di utilizzare una libreria di caricamento delle immagini che ridimensiona l'immagine per adattarla ai limiti.

Se possibile, utilizza i vettori anziché le bitmap

Quando rappresenti qualcosa visivamente sullo schermo, devi decidere se può essere rappresentato come vettore o meno. Preferisci le immagini vettoriali rispetto alle bitmap, in quanto non vengono pixelate quando le ridimensioni in base a dimensioni diverse. Tuttavia, non tutto può essere rappresentato come vettore: le immagini scattate con una fotocamera non possono essere convertite in vettori.

Fornire risorse alternative per schermi di dimensioni diverse

Se carichi immagini con la tua app, ti consigliamo di fornire asset di dimensioni diverse per risoluzioni del dispositivo diverse. In questo modo puoi ridurre le dimensioni del download dell'app sui dispositivi e migliorare le prestazioni, poiché verrà caricata un'immagine con una risoluzione inferiore su un dispositivo con una risoluzione inferiore. Per ulteriori informazioni su come fornire bitmap alternative per dimensioni diverse dei dispositivi, consulta la documentazione relativa alle bitmap alternative.

Quando usi ImageBitmap, chiama prepareToDraw prima di disegnare

Quando utilizzi ImageBitmap, per avviare il processo di caricamento della texture nella GPU, chiama ImageBitmap#prepareToDraw() prima di disegnarla effettivamente. In questo modo, la GPU può preparare la texture e migliorare il rendimento della visualizzazione di un elemento sullo schermo. La maggior parte delle librerie di caricamento delle immagini esegue già questa ottimizzazione, ma se utilizzi la classe ImageBitmap, è un aspetto da tenere presente.

Preferisci passare un Int DrawableRes o un URL come parametri al composable anziché Painter

A causa della complessità della gestione delle immagini (ad esempio, scrivere una funzione uguale per Bitmaps sarebbe dispendiosa dal punto di vista del calcolo), l'API Painter è esplicitamente non contrassegnata come classe Stabile. Le classi instabili possono portare a ricostruzioni non necessarie perché il compilatore non può dedurre facilmente se i dati sono cambiati.

Pertanto, è preferibile passare un URL o un ID risorsa drawable come parametri al composable anziché passare un Painter come parametro.

// Prefer this:
@Composable
fun MyImage(url: String) {

}
// Over this:
@Composable
fun MyImage(painter: Painter) {

}

Non archiviare una bitmap in memoria per più tempo del necessario

Maggiore è il numero di bitmap caricati in memoria, maggiore è la probabilità di esaurire la memoria sul dispositivo. Ad esempio, se stai caricando un lungo elenco di immagini componibili sullo schermo, utilizza LazyColumn o LazyRow per assicurarti che la memoria venga liberata quando scorri un elenco di grandi dimensioni.

Non pacchettizzare immagini di grandi dimensioni con il file AAB/APK

Una delle principali cause delle dimensioni elevate dei download delle app è dovuta alle immagini che vengono impacchettate all'interno del file AAB o APK. Utilizza lo strumento APK Analyzer per assicurarti di non includere nel pacchetto file di immagini di dimensioni maggiori di quelle richieste. Riduci le dimensioni o valuta la possibilità di posizionare le immagini su un server e di scaricarle solo quando necessario.