Performance Issues with large applications?

[alexkuttig]

Hi,

First of all - thanks for the great framework. I really like it and appreciate your contribution to the React Native ecosystem.

I have a question regarding Reanimated performance in large apps.

I created a simple animation, which changes the style of my page header, consisting of an image and a text, based on a scroll view offset. I use a sharedValue and an animatedScrollHandler for the animation. The animation does not trigger anything else like state updates or other animations.

This works fine when using in a single screen. But when using in our real world app, it starts to drop frames (UI and JS thread). Basically, the more screens are mounted, the slower the animation gets. It happens in release and dev mode and mainly on android. When I create the same animation with React Native's built in Animated API, this problem doesn't occur. It works stable at 60fps.

We are using the new architecture in our app and all examples here.

So my question is: Is there anything which can slow down reanimated when having a large apps (large Component Tree, many other animations, even if not running)? Is there anything we have to avoid, to prevent Reanimated from slowing down?

We use React Navigation in our app and I already tried to use enableFreeze().

I would be super thankful for an answer and any tips/hints what could cause this performance problems with Reanimated.

[alexkuttig]

Hi again,

I tested the same setup with React Native 0.76 and Reanimated 3.16.1. It works smooth on the old architecture, but not on the new architecture. React Native's built in Animated API works stable at 60fps on old and new architecture.

Best,
Alex

[mimo-10]

Please check #6710 for a video that show that, please check it : )

[mimo-10]

Hello any updates !? , at least tell us if u guys are working on this, this very very critical; (

[mimo-10]

btw, based oon you definition it is a performance issue, when i scroll especialy when i'm inside a page outside the man stack, fps is around 3 to 5 fps when an animation is triggered, with scrolling, thank u

[tomekzaw]

Hi all, if you're experiencing performance regressions of animations after enabling the New Architecture, please make sure to check out this page we recently added in Reanimated docs:

• ℹ️ Reanimated docs: Performance regressions on the New Architecture

[ConorLindsay94]

Thank you for providing this @tomekzaw

[YueLiXing]

Can we negotiate with the RN team and officially release version 4.2.0 to solve the problem of using multiple flags

[tomekzaw]

We've already asked the React core team at Meta about enabling the preventShadowTreeCommitExhaustion feature flag by default but got no response so far.