useTimestamp

useTimestamp lets you access the current frame timestamp as a Shared Value. It's a convenience wrapper around useFrameCallback for the common case of driving animations or shaders from the current time.

Reference

import { useTimestamp } from 'react-native-reanimated';

function App() {
  const timestamp = useTimestamp();

  // timestamp.value is the time (in ms) elapsed since
  // the first frame. It updates on every frame.
}

Type definitions

function useTimestamp(isActive?: boolean): SharedValue<number>;

Arguments

isActive

Optional

Whether the timestamp should update. Defaults to true.

Returns

useTimestamp returns a Shared Value that updates every frame with the time (in milliseconds) elapsed since the first frame after the hook was activated.

Example

function PulsingDot({ visible }) {
  const timestamp = useTimestamp(visible);

  const animatedStyle = useAnimatedStyle(() => ({
    opacity: 0.5 + 0.5 * Math.sin(timestamp.value / 300),
  }));

  return <Animated.View style={[styles.dot, animatedStyle]} />;
}

Remarks

• Internally wraps useFrameCallback.
• For best performance, prefer to re-use a single useTimestamp instance (for example, by lifting it up and passing it via props or React context) instead of calling useTimestamp in many components.

Platform compatibility

Android	iOS	Web
✅	✅	✅