I think i'm misunderstanding cancelAnimation, can someone help?

[JamesMahy]

Hi,

I've got any animation that plays on a loading screen when it's loading and the component is unmounted when it's not.

I thought, wrongly, that once the component was unmounted the Animation would stop - but I noticed a spike in CPU usage on the app and I narrowed to this animation.

Unfortunately cancelAnimation doesn't seem to actually stop the animation, I've confirmed the component gets unmounted but unless I set a limited number of reps - the animation code never actually stops (and I see CPU spikes of 50% on an iPhone 12 when running.

What am I doing wrong?

Here's my code

const rotation = useSharedValue(0);
  useEffect(() => {
    rotation.value = withRepeat(
      withTiming(1, {
        duration: randomNumberBetween(950, 1000),
        easing: Easing.linear,
      }),
      0,
      false,
    );
    return () => {
      cancelAnimation(rotation);
      rotation.value = 0;
    };
  }, [rotation]);

[JamesMahy]

I realised it wasn't actually unmounting! my mistake.