Using useSharedValue instead of useState

[pvedula7]

My goal is to utilize useSharedValue to mimic the functionality of use/setState within Vision Camera v3 frame processors.

With reanimated I would have this code which uses runOnJS to set the state variable which causes my component to re-render on each Camera frame.

const [poses, setPoses] = useState<SKRNMLKitVisionCameraPluginResultPoseItem[]>([]);
const setPosetoVar = async (framePose) => {
    setPoses(framePose);
  };

const frameProcessor = useFrameProcessor((frame) => {
  "worklet";
  const pose = scanSKRNMLKitPose(frame);
  runOnJS(setPosetoVar)(pose);
  
}, []);

I have tried using shared values like this, but it does not act in the same way as setState by re-rendering component when poses is updated.

const poses = useSharedValue<SKRNMLKitVisionCameraPluginResultPoseItem[]>([]);
const frameProcessor = useFrameProcessor((frame) => {
  "worklet";
  const pose = scanSKRNMLKitPose(frame);
  poses.value = pose
}, []);

I have also tried the setState within the createRunInJSFn which causes to camera to keep reinitializing each time.

const poses = useState<SKRNMLKitVisionCameraPluginResultPoseItem[]>([]);
const setPosetoVar = async (framePose) => {
    setPoses(framePose);
  };
  const setJSPose = Worklets.createRunInJsFn(setPosetoVar)

const frameProcessor = useFrameProcessor((frame) => {
  "worklet";
  const pose = scanSKRNMLKitPose(frame);
  setJSPose(pose)
}, []);

Is there a way to use useSharedValue to mimic the functionality of useState/setState? I am drawing on the camera image and need it to re-render each frame.

[dan-merlea]

Agree! Needs some options for parallel uploading