Работа с изображениями может быстро привести к проблемам с производительностью, если вы не будете осторожны. При работе с большими растровыми изображениями вы можете легко столкнуться с ошибкой OutOfMemoryError
. Следуйте этим рекомендациям, чтобы обеспечить оптимальную производительность вашего приложения.
Загружайте только тот размер растрового изображения, который вам нужен.
Большинство смартфонов оснащены камерами высокого разрешения, создающими большие файлы изображений. При выводе изображения на экран необходимо либо уменьшить его разрешение, либо загружать изображение только в пределах размера контейнера. Постоянная загрузка изображений большего размера, чем требуется, может исчерпать кэш графического процессора, что приведет к снижению производительности отрисовки пользовательского интерфейса.
Для управления размерами изображений:
- Уменьшите размер файлов изображений до максимально возможного размера (не влияя на выходное изображение).
- Рассмотрите возможность конвертации изображений в формат WEBP вместо JPEG или PNG.
- Предоставьте изображения меньшего размера для разных разрешений экрана (см. Совет № 3 ),
- Используйте библиотеку загрузки изображений , которая уменьшает изображение до размеров экрана. Это может помочь повысить скорость загрузки.
По возможности используйте векторные изображения вместо растровых.
При визуальном отображении чего-либо на экране необходимо решить, можно ли представить это в векторном формате. Предпочтение отдаётся векторным изображениям, а не растровым, поскольку они не пикселизируются при масштабировании. Однако не всё можно представить в векторном формате — изображения, снятые камерой, нельзя преобразовать в вектор.
Предоставьте альтернативные ресурсы для разных размеров экрана
Если вы отправляете изображения вместе со своим приложением, рассмотрите возможность предоставления ресурсов разного размера для устройств с разным разрешением. Это поможет уменьшить размер загружаемого файла приложения на устройства и повысить производительность, поскольку на устройствах с таким же разрешением будет загружаться изображение с более низким разрешением. Подробнее о предоставлении альтернативных растровых изображений для устройств с разным разрешением см. в документации по альтернативным растровым изображениям .
При использовании ImageBitmap
вызовите prepareToDraw
перед рисованием.
При использовании ImageBitmap
, чтобы начать процесс загрузки текстуры в графический процессор, вызовите ImageBitmap#prepareToDraw()
перед её отрисовкой. Это помогает графическому процессору подготовить текстуру и повысить производительность отображения изображения на экране. Большинство библиотек загрузки изображений уже выполняют эту оптимизацию, но если вы работаете с классом ImageBitmap
самостоятельно, об этом следует помнить.
Предпочитает передавать Int
DrawableRes
или URL в качестве параметров в ваш компонуемый объект вместо Painter
Из-за сложности работы с изображениями (например, написание функции equals для Bitmaps
потребовало бы больших вычислительных затрат), API Painter
явно не отмечен как стабильный класс. Нестабильные классы могут привести к ненужным перекомпозициям, поскольку компилятору сложно определить, изменились ли данные.
Поэтому предпочтительнее передавать URL-адрес или идентификатор рисуемого ресурса в качестве параметров вашему компонуемому объекту, а не передавать Painter
в качестве параметра.
// Prefer this:
@Composable
fun MyImage(url: String) {
}
// Over this:
@Composable
fun MyImage(painter: Painter) {
}
Не храните растровое изображение в памяти дольше, чем оно вам необходимо.
Чем больше растровых изображений вы загружаете в память, тем выше вероятность нехватки памяти на устройстве. Например, при загрузке большого списка компонуемых изображений на экран используйте LazyColumn
или LazyRow
, чтобы гарантировать освобождение памяти при прокрутке большого списка.
Не упаковывайте большие изображения в файлы AAB/APK.
Одна из основных причин большого размера загружаемых приложений — графика, упакованная в AAB- или APK-файл. Используйте анализатор APK , чтобы убедиться, что размер упаковываемых изображений не превышает требуемого. Уменьшите размер или разместите изображения на сервере и загружайте их только при необходимости.
{% дословно %}Рекомендовано для вас
- Примечание: текст ссылки отображается, когда JavaScript отключен.
- ImageBitmap против ImageVector {:#bitmap-vs-vector}
- Сохранение состояния пользовательского интерфейса в Compose
- Фазы создания реактивного ранца