Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Big memory and cpu leak on android #2027

Closed
v3solutions opened this issue Feb 14, 2018 · 13 comments
Closed

Big memory and cpu leak on android #2027

v3solutions opened this issue Feb 14, 2018 · 13 comments

Comments

@v3solutions
Copy link

v3solutions commented Feb 14, 2018

Is this a bug report?

Memory and cpu leak on android using any navigation (react native navigation, react navigation, even simple if switching pages). Seems like a very serious issue. It increases until it just crashes (in my case ~400mb and cpu 7% on galaxy s5)

Environment

Android
react-native: 0.53.0
react-native-maps: 0.20.0

Steps to Reproduce

(Write your steps here:)

  1. Any two components, one or both containing MapView. While testing i was using just plain MapView, no markers, just with basic options like initialRegion and zoom.
  2. Switching between them will add to memory and cpu significantly. Using most popular navigation tools or simple ifs statements to switch components.

Expected Behavior

Memory and cpu should be somewhat in the same range, now it just simply adding up. Possibly something to do with lifecycle methods.

Actual Behavior

Every single time you switch to MapView it will add cpu and memory until it crashes.

Reproducible Demo

If there's a need i can make a demo project, but this is just basic stuff, 2 components with one of them having a mapview and simply switching between them.

@alvelig
Copy link
Contributor

alvelig commented Feb 14, 2018

That's an interesting case. Any ideas how to localize the leak?

@ltchurch88t
Copy link

A potential avenue to explore would be nesting your MapView inside a screen accessible through the DrawerNavigator for android. This forces you to re-render the MapView when you return to the screen holding that view. I will give it a shot here in a little bit and post some code for you if I come up with a solution.

@v3solutions
Copy link
Author

I'd be happy to sponsor anyone who can come up with a solution this week. It's urgent :(
Btw. it would be great to know how can i compile my own version of react-native-maps after editing library. I can't find any docs regarding this.

@DanGDroid
Copy link

@v3solutions
hi,
to edit a RN lib and use it you have to add it to your project file and use your edited version, but it wont be updated for npm any more.
to add a lib locally:
in your project directory create a Lib folder, and cut and paste the module you want from node-modules folder.
do your changes - it is now in your local project.
in package.json change the import to:
"react-native-maps": "file:./App/Lib/react-native-maps",

@v3solutions
Copy link
Author

@DanGDroid
Thanks, I'll take a look.

@wjielim
Copy link

wjielim commented Feb 26, 2018

@v3solutions Which navigator did you used for that two components containing the MapView?
I suspect that you are using StackNavigator, which will indeed adds up memory consumption because the previous component will still running in background after you switched to the new component.

@v3solutions
Copy link
Author

@wjielim Sorry for a delay. Even using simple if statements (to switch components containing MapView ) adds memory and cpu to it.

@rborn
Copy link
Collaborator

rborn commented Apr 18, 2018

@v3solutions can you test the #2197 PR to see if it fixes this case? Thanks 🤗

@MarkOSullivan94
Copy link
Contributor

@khsily I've seen issues where memory leaks are caused by console.log(...) statements on iOS

@bunyevacz
Copy link

bunyevacz commented Nov 7, 2018

@MarkOSullivan94 thank you for the console.log() tip! You saved my day. It is a problem on android.
If "Debug JS remotely" is enabled, everything is fine. Once I stop it, I click on a button which results a console.log statement, the application stops working, and after about 5 minutes it displays a red out of memory page.

"react": "16.5.0",
  "react-native": "0.57.1",
  "react-navigation": "^2.16.0"

It was a no issue with older react native version (0.44)

@giacomocerquone
Copy link
Contributor

giacomocerquone commented Nov 26, 2019

[EDIT]

Ok my problem was related to markers and I solved it setting the markers to tracksViewChanges to false! The strange thing is actually that it's surely a leak issue considering that, as the author of the issue stated too, this happens (to me too) when mounting and unmounting the component or even when reloading while developing (as I stated in my comment)

[EDIT]

My god... finally, this is it! I've been having my whole app slow while developing and I do understand why now!!
To me it happens when refreshing the app (both with a double R pressing or a live reload), but as mentioned, also when remounting it through a stack navigator in react-navigation. The main and js thread fps drops to 8/10 (I also use some markers, but it's the same without them)

I understand that not every app has a map inside, but this issue is so serious that should be a number 1 priority. What can we do? There have been done some steps forward? I'd be really happy to help somehow

@rborn
Copy link
Collaborator

rborn commented Mar 4, 2020

closing, old issue :)

@rborn rborn closed this as completed Mar 4, 2020
@cinder92
Copy link

still happening on 0.27.1

This issue was closed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

10 participants