Typing animation is causing memory leaks

[KDederichs]

Issue Description

When you open a chat you can see the device CPU constantly around 50 to 60% as well as a steady incline in memory usage.

Steps to Reproduce / Code Snippets

Open a chat, look at your metrics.

Expected Results

It doesn't leak memory/cpu

Additional Information

• Nodejs version: v12.14.1
• React version: 16.11
• React Native version: 0.62.2
• react-native-gifted-chat version: 0.16.1
• Platform(s) (iOS, Android, or both?): both (I think)
• TypeScript version: 3.9.3

After a lot of searching I finally arrived at the root of this, the react-native-typing-animation used in TypingIndicator is CONSTANTLY animating causing this to happen.
Good options would be to either not use this and write one that's less performance hungry OR not mount it until the user is actually typing.
The current solution seems to be letting it run in background and hiding it with the opacity which is suboptimal

[marqroldan]

Hello, I would just like to point out that I think this is still an issue.

I did some ugly checking by removing the whole isTyping block and the CPU jumped to almost 0% (as it should be)
This doesn't seem to be an issue on Android (as I never noticed this) but on iOS it has a very bad impact

[xcarpentier]

Hi @marqroldan,
I removed it from the render tree if not typing, maybe this is an issue on unmount? d83c800
Can you please share your performance analysis (ie. screenshots)?

[shamilovtim]

@KDederichs how did you discover that the animation was to blame for this?

[KDederichs]

Been a while but I think it was a mix of profiler (on mac) the memory graph and then systematically narrow down what it could have been