Проблеми з продуктивністю Lottie зазвичай виникають через файл, а не від програвача. After Effects спрощує додавання функцій, які є дорогими для кадрового відтворення на телефоні.
Почніть з файлу. Маски та матові доріжки часто є найбільшою ціною; замініть їх більш простими формами, де це можливо. Видалення ефектів і розмиття гравцеві не потрібно. Об’єднайте фігури, зменшіть кількість шарів і ретельно скомпонуйте. Великі вбудовані зображення збільшують пам’ять і збільшують вартість декодування, тому оптимізуйте або замініть їх векторами. Інспектор Lottie, наприклад наш безкоштовний засіб перегляду Lottie JSON, допоможе вам побачити, що міститься у файлі.
Потім перевірте, як додаток відтворює це. Анімація, яка повторюється за межами екрана, на закритій вкладці чи в комірці списку, що прокручується, все одно використовує процесор і акумулятор. Призупиняйте їх, коли їх не видно, і зупиняйте непотрібні цикли. Уникайте відтворення десятків анімацій одночасно.
Виберіть правильні варіанти для вашої платформи. В Інтернеті рендерери SVG і canvas працюють по-різному залежно від анімації, тому протестуйте обидва. Стислий формат .lottie (dotLottie) зменшує розмір завантаження. На Android перевірте апаратне прискорення, якщо ваш плеєр підтримує його.
Нарешті, виміряйте на недорогому пристрої. Якщо анімація все ще надто важка, можливо, це невідповідний інструмент для роботи: проста CSS або рідна анімація може замінити декоративний цикл, а інтерактивні компоненти краще вбудувати в інструмент на основі стану, такий як Rive або ExodeUI, який ми створюємо.