Some pending callbacks that might have leaked by never being called from native code: {"24342":{"module":"ReanimatedModule","method":"getValue"}, ...}

Describe the bug I have a large list that is updated frequently by the user. The list behaves correctly but when I leave the screen and return to the screen, I receive an expo error saying console.error: There was a problem sending log messages to your development environment RangeError: Maximum call stack size exceeded.. I get multiple identical warnings from console. I have copied the beginning of one warning below. Usually I just get the warning message pulled up on the screen but occasionally my expo client will freeze and return to the home screen of the iPhone or iOS simulator.

I am testing my app on iOS simulator and the expo app on my iPhone.

My draggable flat list: <DraggableFlatList showsVerticalScrollIndicator={false} data={ data } renderItem={renderItem} keyExtractor={(item, index) => index.toString()} onDragEnd={({ data, from, to }) => { // save changes to state using useContext hook }} ListHeaderComponent={renderHeader} ListFooterComponent={renderFooter} />

From expo: console.error: There was a problem sending log messages to your development environment RangeError: Maximum call stack size exceeded.

From console: Warning: Please report: Excessive number of pending callbacks: 501. Some pending callbacks that might have leaked by never being called from native code: {"24342":{"module":"ReanimatedModule","method":"getValue"},"24386":{"module":"ReanimatedModule","method":"getValue"},"24426":{"module":"ReanimatedModule","method":"getValue"},"24429":{"module":"ReanimatedModule","method":"getValue"},"24443":{"module":"ReanimatedModule","method":"getValue"},"24473": ...

To Reproduce

Platform & Dependencies Please list any applicable dependencies in addition to those below (react-navigation etc).

• Platform: iOS (haven’t tested on Android)
• React Native or Expo version: Expo 38.0.0
• Reanimated version: react-native-reanimated@1.9.0
• React Native Gesture Handler version: react-native-gesture-handler@1.6.1

Additional context Add any other context about the problem here.

[Aximem]

In my case, it seems the error happens because I display DraggableFlatList before the component is mounted. I fix it this way:

state = {
    didFinishInitialAnimation: false
};

componentDidMount() {
    InteractionManager.runAfterInteractions(() => {
        this.setState({
            didFinishInitialAnimation: true
        });
    });
}

render() {
    const { didFinishInitialAnimation } = this.state;
    return didFinishInitialAnimation && (
        <DraggableFlatList
            ...
        />
    );
}

No more errors in logs and, also, no more lags.

[SvenJonsson]

We have this as well in combination mostly prone to happen together with react-native-swipeable-item.