Minimal customizable performance-stable Angular components for rendering After Effects animations. Compatible with Angular 9+.
This monorepo contains two packages for rendering Lottie animations in Angular:
The main package for rendering JSON-based Lottie animations using lottie-web.
npm i lottie-web ngx-lottieFeatures:
- Multiple renderer support (SVG, Canvas, HTML)
- Advanced caching
- Server-side rendering support
- Tree-shakable architecture
Secondary package for rendering .lottie files using @lottiefiles/dotlottie-web with WebAssembly and Web Worker support.
npm i @lottiefiles/dotlottie-web ngx-lottieFeatures:
- WebAssembly-powered rendering
- Web Worker support for better performance
- State machine support
- Smaller file sizes with
.lottieformat
| ngx-lottie | Angular |
|---|---|
| 7.x | >= 8 < 13 |
| 8.x | 13 |
| 9.x | 14 |
| 10.x | 15 |
| 11.x | 17 |
| 12.x | 18 |
| 13.x | 19 |
| 20.x | 20 |
| 21.x | 21 |
Use ngx-lottie when... |
Use ngx-lottie/dotlottie when... |
|---|---|
| You have JSON animation files | You have .lottie files |
| You need maximum compatibility | You want smaller file sizes |
You use advanced lottie-web features |
You need Web Worker rendering |
| You need HTML renderer support | You need state machine support |
MIT © Artur Androsovych