Problemele de performanță Lottie provin de obicei din fișier, nu din player. After Effects facilitează adăugarea de funcții care sunt costisitoare pentru redare cadru cu cadru pe un telefon.
Începeți cu fișierul. Măștile și matele de piste sunt adesea cel mai mare cost; înlocuiți-le cu forme mai simple acolo unde este posibil. Eliminați efectele și estompările de care jucătorul nu are nevoie. Îmbinați formele, reduceți numărul de straturi și precompuneți cu atenție. Imaginile mari încorporate adaugă memorie și costuri de decodare, așa că optimizați-le sau înlocuiți-le cu vectori. Un inspector Lottie, cum ar fi vizualizatorul nostru gratuit Lottie JSON, vă ajută să vedeți ce se află în interiorul unui fișier.
Apoi verificați cum o redă aplicația. Animațiile care continuă să apară în buclă atunci când sunt în afara ecranului, într-o filă închisă sau într-o celulă din listă care a derulat în continuare folosesc procesorul și bateria. Întrerupeți-le când nu sunt vizibile și opriți buclele care nu sunt necesare. Evitați să jucați zeci de animații simultan.
Alegeți opțiunile potrivite pentru platforma dvs. Pe web, redarea SVG și canvas funcționează diferit în funcție de animație, așa că testați-le pe ambele. Formatul .lottie comprimat (dotLottie) reduce dimensiunea descărcării. Pe Android, testați cu accelerare hardware acolo unde playerul dvs. îl acceptă.
În cele din urmă, măsurați pe un dispozitiv low-end. Dacă o animație este încă prea grea, poate fi instrumentul greșit pentru muncă: un simplu CSS sau o animație nativă poate înlocui o buclă decorativă, iar componentele interactive pot fi mai bine construite într-un instrument bazat pe stare, cum ar fi Rive sau ExodeUI, pe care îl realizăm noi.