u/ultra_mind

Like said in the title I have a simple reanimated 4 animation using "withRepeat" causing a 20% CPU usage on idle.

How can would you solve this?

Here is the animation code :

useEffect(() => {
  if (!active) return;
  shimmerX.value = withRepeat(
    withDelay(2000, withTiming(1, {duration: 2000, easing: 
Easing
.
back
(1)})),
    -1,
  );
  return () => cancelAnimation(shimmerX);
}, [active, shimmerX]);

const shimmerStyle = useAnimatedStyle(() => ({
  transform: [{translateX: shimmerX.value * buttonWidth.value}],
  opacity: 0.2 - 
Math
.abs(shimmerX.value) * 0.1,
}));useEffect(() => {
  if (!active) return;
  shimmerX.value = withRepeat(
    withDelay(2000, withTiming(1, {duration: 2000, easing: Easing.back(1)})),
    -1,
  );
  return () => cancelAnimation(shimmerX);
}, [active, shimmerX]);

const shimmerStyle = useAnimatedStyle(() => ({
  transform: [{translateX: shimmerX.value * buttonWidth.value}],
  opacity: 0.2 - Math.abs(shimmerX.value) * 0.1,
}));