Performance issues accessing SharedValue in react-native-reanimated 2.0

Question

I am developing an app which is very animation heavy. I also need to do collision detection. I can not wait for the drop. It needs to be detected live. So I need to watch a the onActive of useAnimatedGestureHandler.

At the moment I just do it with runOnJS to access the shared value and make it accessable for my other components where I can make the collision detection. But that solution has a massive performance issue. I helped myself at only looking for every 10th event but it still has performance issues.

How can I boost the performance and still have the SharedValues accessible for my other components?

Thank you for your help!

  const _startX = startX ? startX : 0;
  const _startY = startY ? startY : 0;

  const x = useSharedValue(_startX);
  const y = useSharedValue(_startY);
  const absoluteX = useSharedValue(0);
  const absoluteY = useSharedValue(0);

  const counter = useSharedValue(0);

  const wrapper = (position) => {
    onActive && onActive(position.absoluteX, position.absoluteY);
  };

  const gestureHandler = useAnimatedGestureHandler({
    onStart: (_, ctx) => {
      ctx.startX = x.value;
      ctx.startY = y.value;
    },
    onActive: (event, ctx) => {
      x.value = ctx.startX + event.translationX;
      y.value = ctx.startY + event.translationY;

      if (counter.value > 10) {
        absoluteX.value = event.absoluteX;
        absoluteY.value = event.absoluteY - difference / 2;
        counter.value = 0;
      }
      counter.value += 1;

      onActive &&
        runOnJS(wrapper)({
          absoluteX: event.absoluteX,
          absoluteY: event.absoluteY - difference / 2,
        });
      },
  });