FreestyleJS Ani
A type-safe, compositional library for building declarative, reusable, and interactive animations in modern web frameworks.
Philosophy
FreestyleJS Ani is a declarative and compositional animation library designed for the modern web. It provides a set of powerful, type-safe primitives to define complex animation structures that can be reused and controlled with precision, offering dedicated, high-performance bindings for React, Solid, Svelte, and Vue.
The core philosophy is to separate an animation's declarative structure from its imperative execution. You define a complex animation once as a static tree, and then use a controller to play it many times with different runtime values.
6x Smaller Bundle Size, but Powerful.
It is also much smaller compared to other animation libraries.
ani= 4.8kBmotion= 31.1kBanime.js= 30.8kBgsap= 26.6kB
Core Features
Declarative & Compositional
Build complex animations by combining simple, reusable nodes. Describe what you want to happen, not how, leading to more readable and maintainable code.
End-to-End Type Safety
Leverage TypeScript to catch errors at compile time. Refactor animations with confidence, knowing your data structures are consistent from definition to execution.
High Performance
Animate styles directly on the DOM, bypassing framework render cycles for buttery-smooth, 60fps animations, even for complex, interactive scenes.
Framework Agnostic
The core engine is pure TypeScript. Use our dedicated bindings for React, Solid, Svelte, and Vue, or integrate it into any project.