`react-native-reanimated` runs animation logic in "worklets" — small JS functions executed on the UI thread — enabling smooth 60fps gesture-driven interactions like a swipeable transaction row, without round-tripping to the JS thread per frame.
import { useSharedValue, useAnimatedStyle, withSpring } from "react-native-reanimated";
function useSwipeAnimation() {
const translateX = useSharedValue(0);
const style = useAnimatedStyle(() => ({
transform: [{ translateX: translateX.value }],
}));
function dismiss() {
translateX.value = withSpring(-400);
}
return { style, dismiss };
}Because worklets run on the UI thread, they can't directly call arbitrary JS functions or access most React state; `runOnJS` is the escape hatch when a worklet needs to trigger JS-side logic, like updating a store after a swipe completes.