[HN Gopher] Show HN: DotLottie Player - A New Universal Lottie P...
___________________________________________________________________
Show HN: DotLottie Player - A New Universal Lottie Player Built
with Rust
Hi HN, For the past few months we've been building dotlottie-rs, a
new Lottie and dotLottie player that aims to run everywhere with
smooth, high frame rate rendering and guarantee visual and feature
support consistency across a large number of platforms and device
types. It is lightweight, has low resource requirements and is
performant. It is MIT-licensed and is available at:
https://github.com/LottieFiles/dotlottie-rs The player is written
in Rust and uses a minimal number of external dependencies. We
utilize uniffi-rs to generate FFI bindings for Kotlin, Swift, and
WASM, which are then used in our platform native distributions for
Android, iOS and Web while maintaining a consistent API and
experience across them. We also provide distributions for React and
Vue to make it easy to adopt in many existing web projects. The
player is also ideal for use in backend systems and pipelines for
high performance server-side rendering of Lottie/dotLottie, and can
be used easily in NodeJS projects. The player is named dotlottie-
rs because, apart from the first class Lottie support, we aim to
have first class support for dotLottie (https://www.dotlottie.io),
a superset of Lottie we developed that builds on Lottie to add
enhanced features like multi-animation support, improved resource
bundling, theming, state machines and interactivity (latter two are
currently in development). Under the hood, the player uses the
open-source, lightweight, high performance ThorVG library
(https://www.thorvg.org/) for vector graphics and Lottie rendering,
supporting software, OpenGL, and WebGPU (currently in beta)
rasterization backends. We are working towards landing complete
support of the Lottie format spec (https://lottie.github.io/) as
soon as possible. We are starting to test and deploy it across our
platform and hope it helps achieve similar improvements in
performance and support as we are seeing! There's a few demos:
Rust project: https://github.com/LottieFiles/dotlottie-
rs/tree/main/demo-p... Web:
https://github.com/LottieFiles/dotlottie-web?tab=readme-ov-f...
Would love to hear your thoughts and feedback :)
Author : jawishhameed
Score : 38 points
Date : 2024-04-04 13:59 UTC (9 hours ago)
(HTM) web link (github.com)
(TXT) w3m dump (github.com)
| kiwicopple wrote:
| What advantages does this have over the players from Airbnb? Will
| it work with existing Lottie animations?
| Osbro wrote:
| The rendering implementation of Airbnb's Lottie players--
| specifically lottie-web, lottie-android, and lottie-ios is
| independent, leading to issues of rendering inconsistency
| across some animations. dotlottie-rs is a cross-platform player
| using ThorVG under the hood to ensure consistent rendering
| across all platforms, whether mobile or web. We're also
| building stuff like theming, multi-animation support and
| interactivity into the player.
|
| Currently, ThorVG supports most Lottie animation features, with
| the exceptions of Layer Effects and some minor Text features.
| However, it is under active development, and full support for
| Lottie animations is expected to be achieved soon!
| jawishhameed wrote:
| > What advantages does this have over the players from Airbnb?
| Those are still great alternatives! In the existing Airbnb
| suite of players, the implementations for web, iOS and Android
| are completely different and have different sets of Lottie
| feature support and have visual inconsistencies in the output.
|
| This fragmentation creates a less than ideal workflow for both
| motion designers and developers where animations need to be
| tested on the different players to verify before shipping. With
| dotlottie-rs suite of players, we are hoping to solve this
| problem. You can also generally expect better performance,
| especially with Lotties with large number of elements and the
| complex layer effects possible in Lottie.
|
| > Will it work with existing Lottie animations? The current
| release supports >95% of the animations on our community
| contributed free animations library. No changes required! We
| open-sourced a tool called relottie
| ((https://github.com/LottieFiles/relottie) to detect
| unsupported features in a Lottie for this player (and other
| players) to help folks build a validation step in their CI/CD.
|
| We are making frequent contributions and releases on ThorVG and
| dotlottie-rs to get to 100% support!
| steventey wrote:
| Great choice to go with Rust for the implementation!
| jawishhameed wrote:
| We are loving it! Team picked up Rust and got started building
| productively in a few weeks.
| hermet wrote:
| The fact that apps across multiple platforms support different
| Lottie specifications presents a clear issue, similar to how SVG
| has faced compatibility issues within the industry for decades. A
| cross-platform designed dotLottie player is highly appealing for
| addressing this issue. It is similar to how 3rd party apps hope
| to implement the same business logic across multiple products.
| With a dotLottie player, apps expect to have the same killer
| motion design among the different targets!
|
| To add a note, At the core of dotLottie is an super lightweight
| Lottie rendering engine(https://github.com/thorvg/thorvg). It is
| small enough (300kb) to run on low-spec devices like ESP, MPU,
| and MCU (it's proven within LVGL https://lvgl.io/ framework), and
| we can expect the hardware acceleration features for high-
| performance devices, including nested multi-threading task
| scheduler, SIMD, OpenGL, and WebGPU (though some of them are
| under the beta dev but aggresively working on). It has proven
| stable to be used in practical applications (even it's in Godot
| game engine) across various devices and also offers a web player
| through WebAssembly. We can check the ThorVG-based Lottie web
| player can be completed in less than 500KB (You can directly test
| Lottie animations at www.thorvg.org/viewer). This ensures the
| scalability of the dotLottie player from low-spec device
| environments to high-spec web environments & apps.
| haburka wrote:
| Thanks for building this! Just recommended it to my team since
| there's finally a fairly lightweight Lottie player.
|
| I think you should really highlight that actual size of the
| player is ~16 Kb now (using NextJs) since that was a huge reason
| as to why I avoided Lottie for so long. The Airbnb Lottie was
| ~250kb.
|
| Haven't started using it yet so no issues :)
| jawishhameed wrote:
| Sorry, 16 Kb would be a dream for us but we aren't there! The
| Javascript for the play API and bindings for WASM is around 18
| Kb now - but the WASM bundle that is then loaded is currently
| 308 Kb. :(
| kosolam wrote:
| Hey team! Looks great, I checked some of the examples on github.
|
| A few questions regarding the web version 1. What is the total
| weight of loaded resources? 2. If I would like to add some
| animations to my website. Maybe even just a few simple animated
| icons. Is dotlottie and in general lottie files a good fit for
| such use case? 3. How good is the support among the different
| browsers on the desktop and mobiles?
| jawishhameed wrote:
| > 1. What is the total weight of loaded resources?
|
| Current release clocks in at 326 Kb over the network, with
| brotli. We have been focussed on getting the functionality and
| have yet to start working on reducing the total size. There are
| optimizations we can do with ThorVG and emscripten and
| eliminating some of the dependencies we currently use. Aiming
| for < 200 Kb.
|
| > 2. If I would like to add some animations to my website.
|
| We believe so! With the Lottie animations converted to
| dotlottie (using our website or the opensource tooling), there
| is significant further file reduction to Lottie animations,
| especially if you choose to bundle multiple animations into a
| single dotlottie distribution. Depending on the number of
| animations you have, the currently somewhat large player size
| is offset by the further reduction and bundling. It becomes an
| even better proposition if you are using theming to change
| colors or values in the animation for different themes the
| website may have. The vector nature of the format also makes it
| ideal if dynamic resizing for media size adjustments are a
| requirement!
|
| > 3. How good is the support among the different browsers on
| the desktop and mobiles?
|
| With the current release, we are targetting for full
| compatibility and consistency in the modern evergreen browsers.
| We haven't yet tested the compatibilty with older browsers
| though. The support on mobile is great on both Android and iOS,
| as well as for desktop apps.
___________________________________________________________________
(page generated 2024-04-04 23:01 UTC)