Layout Animations

This is your first choice for enter/exit and reflow. Before you reach for useSharedValue + useEffect + useAnimatedStyle, ask: can a built-in layout animation do it? Almost always, yes. One prop replaces a whole hook block, runs on the UI thread automatically, and reads clearly.

// Bad — hand-rolling a fade-in that a built-in already does
const Toast = ({ children }) => {
  const opacity = useSharedValue(0);
  useEffect(() => { opacity.value = withTiming(1, TIMING); }, []);
  const style = useAnimatedStyle(() => ({ opacity: opacity.value }));
  return <Animated.View style={style}>{children}</Animated.View>;
}

// Good — one prop, same result, less to break
import Animated, { FadeIn, FadeOut } from 'react-native-reanimated';