[Android] Scroll jank, freezes and missed taps in long lists with ReanimatedSwipeable rows since 3.1.x/3.2.x (works on 3.0.2) #4561

Description

On Android, a long FlatList / SectionList (from react-native) where every row is wrapped in ReanimatedSwipeable scrolls poorly after upgrading from 3.0.2:

• scrolling stutters and freezes briefly (visible frame drops),
• taps on rows are sometimes not registered,
• the longer the list, the worse it gets.

It is reproducible on 3.2.1 and still present on 3.3.0. Pinning back to 3.0.2 fixes it (verified on a release build). iOS is not affected.

Things we ruled out:

• Backporting Keep ReanimatedSwipeable native handlers stable when event callbacks change #4466 (stable Swipeable handler config) onto 3.2.1 did not help.
• Lazily mounting the ReanimatedSwipeable per row did not help.

Our guess (not verified): this comes from the Android native touch-handling changes in #4367 (3.2.0). After it, v3 handlers inside rows no longer seem to be cancelled when the RN ScrollView takes over the touch. #4441 describes the same behaviour for buttons. A possible contributor is #4273 (3.1.0), which sends ACTION_CANCEL to views under the pointer when the root starts intercepting. We are happy to bisect further with nightlies if that helps.

import React from 'react';
import { FlatList, Text, TouchableHighlight, View } from 'react-native';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import Swipeable from 'react-native-gesture-handler/ReanimatedSwipeable';

const DATA = Array.from({ length: 200 }, (_, i) => ({ id: String(i) }));

const RightActions = () => (
  <View style={{ width: 128, flexDirection: 'row' }}>
    <View style={{ flex: 1, backgroundColor: 'red' }} />
    <View style={{ flex: 1, backgroundColor: 'gray' }} />
  </View>
);

const Row = ({ id }: { id: string }) => (
  <Swipeable renderRightActions={RightActions} friction={2} rightThreshold={40} overshootRight={false}>
    <TouchableHighlight underlayColor="transparent" onPress={() => console.log('press', id)}>
      <View style={{ padding: 22, backgroundColor: 'white' }}>
        <Text>Row {id}</Text>
      </View>
    </TouchableHighlight>
  </Swipeable>
);

export default function App() {
  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
      <FlatList data={DATA} keyExtractor={(item) => item.id} renderItem={({ item }) => <Row id={item.id} />} />
    </GestureHandlerRootView>
  );
}

A link to a Gist, an Expo Snack or a link to a repository based on this template that reproduces the bug.

react-native-reanimated: 4.5.0

• react-native-worklets: 0.10.2
• react-native-screens: 4.19.0
• react-native-safe-area-context: 5.6.2
• react-native-pager-view: 6.9.1
• react-native-tab-view: 3.1.1
• @react-navigation/native: 7.3.16, @react-navigation/stack: 7.6.15, @react-navigation/bottom-tabs: 7.10.0
• Expo: not used (bare React Native)
• JS engine: Hermes; Architecture: New Architecture (Fabric)

Gesture Handler version

3.3.0 (also 3.2.1; works on 3.0.2)

React Native version

0.86.3

Platforms

Android

JavaScript runtime

Hermes

Workflow

React Native (without Expo)

Architecture

New Architecture (Fabric)

Build type

Release mode

Device

Real device

Device model

Android Devices.

Other relevant versions: react-native-reanimated 4.5.0, react-native-worklets 0.10.2, react-native-screens 4.19.0.

Steps to reproduce

1. Render a FlatList from react-native with ~200 rows.
2. Wrap each row in ReanimatedSwipeable with renderRightActions. Use a pressable as the row content (TouchableHighlight from react-native).
3. Build a release build and run it on an Android device.
4. Scroll up and down quickly, then tap rows while and right after scrolling.

Expected: smooth scrolling and every tap registered, same as on 3.0.2.
Actual: stutter and short freezes while scrolling, and some taps are ignored.

Gesture Handler version

3.3.0 (also 3.2.1; works on 3.0.2)

React Native version

0.86.3

Platforms

Android

JavaScript runtime

None

Workflow

Please check the video below.

Build type

Release

Device

Android Devices

Device model

Android devices

Acknowledgements

Yes