React-Native app freezing on Android 13 when using animations inside inverted FlatList

Description

I am facing an issue with animations inside inverted flat-lists on android. After a few seconds, the app gets laggy and finally seems to freeze and causes ANR-Alerts. I first noticed the problem in the live version of our app after updating my phone to Android 13. In our case, the problem is triggered by a typing indicator animation within react-native-gifted-chat. After further investigation, I was able to identify the animation within an inverted FlatList as the cause of the problem (see code example below).

Video of the issue:

https://user-images.githubusercontent.com/86466408/188163278-66deec4d-b8f0-4394-a771-8f7d2e9e6955.mp4

Further findings:

• I’ve only been able to reproduce the issue on my phone so far, so here’s some more detailed information about the device:
  • Device: Google Pixel 4
  • Android Version: 13 (TP1A.220624.014)
  • Rooted: no
• iOS does not seem to be affected
• The type of animation does not seem to matter
• As the issue occurs in our live app, so it’s not a debug issue
• Possibly related issue: https://github.com/facebook/react-native/issues/30034
  • The scaleY: -1 fix suggested in this thread also fixes this issue, as the inverted prop of flatlist is causing it
• Note: the number of animations is not relevant: Although I render an animation for each line in my example, there are only 20 lines in total. A single animation (e.g. in the ListHeaderComponent) is sufficient to reproduce the issue.

Excerpt from the android logs:

2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8809ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8800ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8790ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8781ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8773ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8763ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8753ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8745ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8736ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8726ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8717ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8708ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8699ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8690ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8681ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8672ms processing MotionEvent
2022-09-02 14:36:40.142 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8664ms processing MotionEvent
2022-09-02 14:36:40.143 1849-2276/? I/InputDispatcher: 13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) spent 8648ms processing MotionEvent
...
2022-09-02 14:36:40.154 1849-28955/? E/ActivityManager: ANR in com.awesomeproject (com.awesomeproject/.MainActivity)
    PID: 27392
    Reason: Input dispatching timed out (13c9f64 com.awesomeproject/com.awesomeproject.MainActivity (server) is not responding. Waited 5001ms for MotionEvent)
    Parent: com.awesomeproject/.MainActivity
    ErrorId: d7e8d93d-8fd5-43c5-9acd-bf012e4f6592
    Frozen: false
    Load: 3.95 / 2.91 / 2.7
    ----- Output from /proc/pressure/memory -----
    some avg10=0.06 avg60=0.07 avg300=0.01 total=409463474
    full avg10=0.00 avg60=0.00 avg300=0.00 total=139253478
    ----- End output from /proc/pressure/memory -----
    
    CPU usage from 23405ms to 0ms ago (2022-09-02 14:36:12.971 to 2022-09-02 14:36:36.376):
      95% 27392/com.awesomeproject: 89% user + 6% kernel / faults: 8984 minor 25 major
      18% 711/surfaceflinger: 12% user + 5.2% kernel / faults: 1437 minor 1 major
      7.9% 713/android.hardware.graphics.composer@2.4-service-sm8150: 3.8% user + 4% kernel / faults: 14 minor
      7.4% 1849/system_server: 4.6% user + 2.8% kernel / faults: 12861 minor 17 major
      3.5% 296/crtc_commit:125: 0% user + 3.5% kernel
      3.4% 3899/com.google.android.googlequicksearchbox:interactor: 2.2% user + 1.1% kernel / faults: 21792 minor 7876 major
      2.8% 2403/com.android.systemui: 1.9% user + 0.8% kernel / faults: 6076 minor 10 major
      2% 9902/com.google.android.gms.persistent: 1.4% user + 0.6% kernel / faults: 3235 minor 2295 major
      1.7% 24317/kworker/u16:1: 0% user + 1.7% kernel
      1.6% 28229/kworker/u16:2: 0% user + 1.6% kernel
      1.4% 28450/kworker/u16:6: 0% user + 1.4% kernel
      0.4% 1389/media.swcodec: 0.1% user + 0.2% kernel / faults: 9932 minor 12 major
      1.2% 5807/com.google.android.inputmethod.latin: 0.8% user + 0.4% kernel / faults: 3280 minor 33 major
      0.9% 1083/[e-mail]: 0.8% user + 0.1% kernel
      0.8% 288/kgsl_worker_thr: 0% user + 0.8% kernel
      0.2% 26061/kworker/u16:8: 0% user + 0.2% kernel
      0.7% 1424/adbd: 0.2% user + 0.4% kernel / faults: 336 minor
      0.6% 28366/kworker/u16:3: 0% user + 0.6% kernel
      0.4% 891/iaxxx tunnel pr: 0% user + 0.4% kernel
      0% 1325/media.extractor: 0% user + 0% kernel / faults: 4060 minor
      0.3% 2718/com.android.phone: 0.2% user + 0% kernel / faults: 975 minor 8 major
      0.3% 3977/com.android.nfc: 0.2% user + 0.1% kernel / faults: 1628 minor 26 major
      0.2% 9/rcu_preempt: 0% user + 0.2% kernel
      0.2% 297/crtc_event:125: 0% user + 0.2% kernel
      0.2% 653/logd: 0.1% user + 0.1% kernel / faults: 46 minor
      0.2% 1135/audioserver: 0% user + 0.2% kernel / faults: 1240 minor
      0% 1360/media.codec: 0% user + 0% kernel / faults: 1529 minor 7 major
      0.2% 22144/com.facebook.katana: 0.1% user + 0.1% kernel / faults: 2 minor
      0.2% 2495/com.android.networkstack.process: 0.1% user + 0.1% kernel / faults: 591 minor
      0.2% 18101/com.instagram.android: 0.1% user + 0.1% kernel / faults: 34 minor
      0.2% 26706/com.twitter.android: 0.1% user + 0% kernel / faults: 18 minor
      0.2% 1100/vendor.google.wifi_ext@1.0-service-vendor: 0.1% user + 0% kernel / faults: 128 minor
      0.2% 2637/.qtidataservices: 0.2% user + 0% kernel / faults: 935 minor 16 major
      0.2% 16091/com.android.bluetooth: 0% user + 0.1% kernel / faults: 552 minor
      0.2% 26596/logcat: 0% user + 0.1% kernel
      0.2% 28491/kworker/u17:1: 0% user + 0.2% kernel
      0.1% 1021/qrtr_rx: 0% user + 0.1% kernel
      0% 2715/com.android.se: 0% user + 0% kernel / faults: 442 minor 1 major
      0.1% 3395/com.google.android.apps.scone: 0.1% user + 0% kernel / faults: 39 minor
      0% 4034/com.qualcomm.qti.services.secureui:sui_service: 0% user + 0% kernel / faults: 645 minor 1 major
      0.1% 12/rcuop/0: 0% user + 0.1% kernel
      0.1% 2586/com.google.oslo: 0% user + 0% kernel / faults: 586 minor
      0% 2657/com.qti.phone: 0% user + 0% kernel / faults: 445 minor
      0% 2687/org.codeaurora.ims: 0% user + 0% kernel / faults: 506 minor 2 major
      0% 4000/com.google.SSRestartDetector: 0% user + 0% kernel / faults: 427 minor
      0.1% 27925/kworker/2:0: 0% user + 0.1% kernel
      0% 30/rcuop/2: 0% user + 0% kernel
      0% 46/rcuop/4: 0% user + 0% kernel
2022-09-02 14:36:40.155 1849-28955/? E/ActivityManager:   0% 62/rcuop/6: 0% user + 0% kernel
      0% 98/system: 0% user + 0% kernel
      0% 144/kswapd0: 0% user + 0% kernel
      0% 337/spi5: 0% user + 0% kernel
      0% 772/tombstoned: 0% user + 0% kernel
      0% 1032/ipacm: 0% user + 0% kernel
      0% 1045/statsd: 0% user + 0% kernel / faults: 165 minor 1 major
      0% 1046/netd: 0% user + 0% kernel / faults: 222 minor
      0% 1069/android.hardware.contexthub-service.generic: 0% user + 0% kernel
      0% 1113/msm_irqbalance: 0% user + 0% kernel
      0% 1217/irq/295-fts: 0% user + 0% kernel
      0% 1308/cameraserver: 0% user + 0% kernel / faults: 80 minor
      0% 2282/android.hardware.input.processor-service: 0% user + 0% kernel / faults: 8 minor
      0% 2601/com.android.hbmsvmanager: 0% user + 0% kernel / faults: 440 minor
      0% 2606/.dataservices: 0% user + 0% kernel / faults: 438 minor
      0% 2669/com.google.android.grilservice: 0% user + 0% kernel / faults: 452 minor
      0% 2826/com.google.android.apps.nexuslauncher: 0% user + 0% kernel / faults: 6 minor
      0% 3148/irq/33-90cd000.: 0% user + 0% kernel
      0% 3999/com.android.ims.rcsservice: 0% user + 0% kernel / faults: 441 minor
      0% 10045/com.google.android.gms: 0% user + 0% kernel / faults: 43 minor 30 major
      0% 25429/com.google.android.youtube: 0% user + 0% kernel / faults: 64 minor
      0% 10/rcu_sched: 0% user + 0% kernel
      0% 22/rcuop/1: 0% user + 0% kernel
      0% 35/ksoftirqd/3: 0% user + 0% kernel
      0% 38/rcuop/3: 0% user + 0% kernel
      0% 47/rcuos/4: 0% user + 0% kernel
      0% 63/rcuos/6: 0% user + 0% kernel
      0% 535/kworker/5:1H: 0% user + 0% kernel
      0% 654/lmkd: 0% user + 0% kernel
      0% 710/android.hardware.power-service.pixel-libperfmgr: 0% user + 0% kernel
      0% 821/loop9: 0% user + 0% kernel
      0% 877/loop23: 0% user + 0% kernel
      0% 892/iaxxx tunnel co: 0% user + 0% kernel
      0% 895/loop26: 0% user + 0% kernel
      0% 1064/android.hardware.audio.service: 0% user + 0% kernel / faults: 19 minor
      0% 1065/android.hardware.bluetooth@1.0-service-qti: 0% user + 0% kernel
      0% 1332/media.metrics: 0% user + 0% kernel / faults: 508 minor 5 major
      0% 1340/mediaserver: 0% user + 0% kernel / faults: 186 minor 4 major
      0% 1358/wificond: 0% user + 0% kernel / faults: 1 major
      0% 1386/qcrild: 0% user + 0% kernel / faults: 8 minor 6 major
      0% 1685/qrtr_rx: 0% user + 0% kernel
      0% 3118/loop32: 0% user + 0% kernel
      0% 3147/irq/32-90b6400.: 0% user + 0% kernel
      0% 16117/scheduler_threa: 0% user + 0% kernel
      0% 21460/kworker/0:3: 0% user + 0% kernel
      0% 21837/kworker/1:2: 0% user + 0% kernel
      0% 22195/com.instagram.android:mqtt: 0% user + 0% kernel / faults: 6 minor
      0% 23051/kworker/5:0: 0% user + 0% kernel
      0% 23206/kworker/3:1: 0% user + 0% kernel
      0% 26913/com.android.chrome: 0% user + 0% kernel / faults: 2 minor
      0% 27626/android.process.acore: 0% user + 0% kernel / faults: 248 minor 268 major
      0% 27752/kworker/4:0: 0% user + 0% kernel
      0% 28149/com.kubi.kucoin: 0% user + 0% kernel / faults: 13 minor
      0% 28490/kworker/u17:0: 0% user + 0% kernel
    20% TOTAL: 15% user + 4.4% kernel + 0.2% iowait + 0.6% irq + 0.1% softirq
    CPU usage from 25ms to 351ms later (2022-09-02 14:36:36.401 to 2022-09-02 14:36:36.727):
      99% 27392/com.awesomeproject: 99% user + 0% kernel
        103% 27462/RenderThread: 103% user + 0% kernel
      29% 1849/system_server: 14% user + 14% kernel / faults: 793 minor
        26% 28955/AnrConsumer: 11% user + 14% kernel
        3.7% 2305/WifiHandlerThre: 0% user + 3.7% kernel
      3.5% 1083/[e-mail]: 0% user + 3.5% kernel
        3.5% 11918/11_see: 3.5% user + 0% kernel
      4% 9902/com.google.android.gms.persistent: 0% user + 4% kernel
        4% 11999/SensorBatchThre: 4% user + 0% kernel
    18% TOTAL: 14% user + 3.4% kernel + 0.3% irq + 0.3% softirq

Version

0.69.5

Output of npx react-native info

System: OS: macOS 12.5.1 CPU: (12) x64 Intel® Core™ i7-9750H CPU @ 2.60GHz Memory: 23.44 MB / 16.00 GB Shell: 5.8.1 - /bin/zsh Binaries: Node: 14.19.1 - ~/.nvm/versions/node/v14.19.1/bin/node Yarn: 1.22.18 - /usr/local/bin/yarn npm: 6.14.16 - ~/.nvm/versions/node/v14.19.1/bin/npm Watchman: 2022.03.21.00 - /usr/local/bin/watchman Managers: CocoaPods: 1.11.3 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5 Android SDK: Not Found IDEs: Android Studio: 3.5 AI-191.8026.42.35.5977832 Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild Languages: Java: 13.0.2 - /usr/bin/javac npmPackages: @react-native-community/cli: Not Found react: 18.0.0 => 18.0.0 react-native: 0.69.5 => 0.69.5 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found

Steps to reproduce

1. Create a new project using npx react-native init AwesomeProject --version 0.69.5.
2. Replace the content of App.js with the snipped below.
3. Start the app on an Android Phone: It’s unclear which device / OS combinations are affected, I could only reproduce it on my Pixel 4 with Android 13 - I tried it on a bunch of other android phones where I could not reproduce this issue.
4. Wait a bit: after 10 ~ 20 seconds the app freezes.

Snack, code example, screenshot, or link to a repository

import React from 'react'
import { FlatList, View, Text, ActivityIndicator } from 'react-native'

const data = []
for (let i = 0; i < 20; i++) data.push(i)

const App = () => {
  return (
    <FlatList
      keyExtractor={(item) => item}
      data={data}
      inverted
      renderItem={(item) => (
        <View
          style={{
            backgroundColor: 'white',
            flexDirection: 'row',
            padding: 20
          }}
        >
          <ActivityIndicator size='large' color='red' />
          <Text
            style={{
              fontSize: 32,
              marginLeft: 10
            }}
          >
            {`Item ${item.item}`}
          </Text>
        </View>
      )}
    />
  )
}

export default App

[afiller]

Hello, is there any official solution already? We are facing this issue with several Pixel users on Android 13 already.

[MikelH911]

Hello,

Same problem here except it happens on my Samsung S21 Ultra and on my friend’s Samsung phone too. Both of them on Android 13, older versions of Android doesn’t seem to be affected. iOS not affected too.

Any kind of animation used seem to create the same behavior.

For me, it happens also if the animation is outside the Flatlist. If I use any animation on my component and I have an inverted Flatlist, the app freeze afer a few seconds.

I think more and more people will be facing this issue after upgrading to Android 13