Sobre o projeto

O dotLottie Web é o player oficial da LottieFiles para incorporar animações Lottie (.json) e dotLottie (.lottie) em aplicações web. Ele utiliza um núcleo Rust + WASM do dotlottie-rs, com o ThorVG como renderizador vetorial. O player suporta renderização de software Canvas2D, WebGL2 e backends experimentais WebGPU; a troca de backends é feita através de importações de subcaminhos, mantendo a mesma classe DotLottie e API. O projeto também documenta o suporte isomórfico para Node.js 18+ para renderização no lado do servidor, geração de miniaturas ou extração de quadros. O player suporta recursos do dotLottie v2, incluindo temas em tempo real com regras de cor, escalar, posição, vetor, gradiente, imagem e texto; máquinas de estado interativas com eventos tipados; e áudio incorporado reproduzido em sincronia com a linha do tempo da animação. Uma opção DotLottieWorker renderiza em um Web Worker com OffscreenCanvas, e seus métodos são baseados em Promise porque cruzam a fronteira do worker. O backend de software padrão funciona amplamente, enquanto WebGL2 e WebGPU são opcionais para casos de alta demanda. O repositório fornece seis pacotes de SDK primários: @lottiefiles/dotlottie-web para JavaScript puro, além de React, Vue 3, Svelte, Solid e um pacote de Web Component agnóstico a frameworks. Todos renderizam arquivos Lottie JSON e dotLottie. Os controles de tempo de execução incluem alternância de múltiplas animações com animationId e loadAnimation, marcadores nomeados, segmentos de quadro, ajuste e alinhamento de layout, slots para dados dinâmicos, modos de reprodução como forward, reverse, bounce e reverse-bounce, interpolação de quadros e congelamento quando o canvas sai da tela. O player expõe mais de 25 eventos tipados, abrangendo load, play, pause, frame, complete, loop e transições de máquina de estado. O projeto inclui um visualizador hospedado com páginas de home, playground, performance, list e embed; exemplos no CodePen; e exemplos locais executáveis para web, Node.js, React, Vue, Solid, Web Component e renderização segura para Next.js SSR. Os recursos de ambiente necessários são WebAssembly, Canvas 2D e Fetch API; melhorias opcionais incluem Web Workers, OffscreenCanvas, WebGL2 e WebGPU. Os navegadores mínimos documentados são Chrome 57+, Firefox 52+, Safari 11+, Edge 16+ e iOS Safari 11+, com Node.js 18+ para uso no servidor. O código possui licença MIT.