react-native - 在 react-native-reanimated 2.0 中访问 SharedValue 的性能问题

Question

我正在开发一个非常重动画的应用程序。我还需要做碰撞检测。我不能等待下降。它需要实时检测。所以我需要看一个onActive。useAnimatedGestureHandler

目前，我只是runOnJS访问共享值并使其可用于我可以进行碰撞检测的其他组件。但是该解决方案存在巨大的性能问题。我帮助自己只寻找每 10 个事件，但它仍然存在性能问题。

如何提高性能并让其他组件仍然可以访问 SharedValues？

谢谢您的帮助！

  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,
        });
      },
  });