A Lottie teljesítményproblémák általában a fájlból származnak, nem a lejátszóból. A After Effects segítségével egyszerűen hozzáadhat olyan funkciókat, amelyek költséges megjelenítése képkockánként egy telefonon.
Kezdje a fájllal. A maszkok és a nyomkövető matt gyakran a legnagyobb költséget jelentik; lehetőség szerint cserélje ki őket egyszerűbb formákkal. Távolítsa el az effektusokat és az elmosódásokat, amelyekre a lejátszónak nincs szüksége. Egyesítse az alakzatokat, csökkentse a rétegek számát, és gondosan készítsen előkompozíciót. A nagyméretű beágyazott képek memóriát és dekódolási költségeket növelnek, ezért optimalizálja vagy cserélje ki őket vektorokra. A Lottie ellenőr, például az ingyenes Lottie JSON megjelenítő segít meglátni, mi van egy fájlban.
Ezután ellenőrizze, hogyan játssza le az alkalmazás. Azok az animációk, amelyek a képernyőn kívül, egy bezárt lapon belül vagy egy listacellában folyamatosan mozognak, továbbra is a CPU-t és az akkumulátort használják. Szüneteltesse meg őket, ha nem láthatók, és állítsa le azokat a hurkokat, amelyekre nincs szükség. Kerülje el több tucat animáció egyidejű lejátszását.
Válassza ki a megfelelő lehetőségeket a platformhoz. Az interneten a SVG és a vászonmegjelenítők az animációtól függően eltérően teljesítenek, ezért mindkettőt tesztelje. A tömörített .lottie (dotLottie) formátum csökkenti a letöltési méretet. Androidon tesztelje hardveres gyorsítással, ahol a lejátszó támogatja.
Végül mérjen egy alsókategóriás készüléken. Ha egy animáció még mindig túl nehéz, akkor lehet, hogy nem megfelelő eszköz a feladathoz: egy egyszerű CSS vagy natív animáció helyettesítheti a dekoratív hurkot, és az interaktív komponensek jobban beépíthetők egy állapotalapú eszközbe, például a Rive vagy a ExodeUI, amelyeket mi készítünk.