Open source · Author
Inertia — declarative animations for React Native
TypeScriptinertia
Declarative animation primitives for React Native — a thin wrapper over react-native-reanimated 4 where animations are props on a component. Drop in a Motion primitive, hand it an animate prop, and the spring runs on the UI thread.
Why it mattered
Reanimated is superb, but the worklet model is a lot to carry for a fade-in. Inertia was built to clear specific sharp edges I kept hitting in the existing wrappers: style types that didn't narrow per element, spring params borrowed from physics rather than from the API people already knew, and gesture props that had multiplied into a whileTap/whilePress soup. Mount, exit, per-property transitions and gestures all share one shape.
Code contributions
- Animations expressed as animate and transition props — shared values, worklets and useAnimatedStyle stay hidden
- Style types inferred per primitive: Motion.View takes ViewStyle, Motion.Text takes TextStyle, so wrong props fail at compile time
- react-spring's vocabulary (tension, friction, mass, velocity) instead of Reanimated's raw stiffness/damping
- One gesture prop shape — pressed, focused and hovered on every primitive, rather than a separate pressable variant
- Memoized worklet factory hashes resolved animate/transition objects, so re-renders with unchanged values allocate no new UI-thread closures
- Tree-shakable subpaths per primitive, with bundle size verified in CI
Tech
Links
Other projects
Want something like this built?
Get in touch →