-
Notifications
You must be signed in to change notification settings - Fork 24.3k
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
[Serious Bug] Android Image not render after a few times of uses #8677
Comments
I have never once experienced this bug. Can you show a code-example where this happens? |
http://facebook.github.io/react-native/releases/0.26/docs/known-issues.html#memory-issues-with-png-images |
@RooneyLeeSJ My image is all JPG, from the camera roll |
I just want to build the Fresco from source into the react-native to debug the error. But I haven't found a way to build it with react-native. Can anyone give a suggestion? |
@fab1an I think the UIExplorer CameraRollExample could re-produce this problem if your mobile phone has many photos. Browse it and reload JS a few times, it may happen. |
@narychen What version of React Native are you using? To build React Native from source and setting up logcat you can follow these instructions : Build React Native from source & Investigating issues with logcat. |
@charpeni I have already built the ReactAndroid from source code. |
@charpeni The bug exists from the early version of 0.15 to 0.27.2 which I am using now. |
I hope someone responsible for the Image module of ReactAndroid in facebook could come out and fix it because it has existed for really a long time and never get any attention. |
Can you reproduce this? Does using |
Are you up to provide an example project with the easy reproducible bug without dependancy to |
@fab1an I tried Fresco.shutDown() and imagePipeline.clearCaches(). It didn't work. And further more the code of shutDown will call clearCaches but will not create a new imagepipeline if the old instance is not null. So call shutDown() will be the same with clearCaches() |
@charpeni When I first used react-native to create something half a year ago, I just noticed it will not render image after a few times of reloading. I didn't pay a lot of attention because I thought it may be a problem of reloading. If you don't use CameraRoll, the image number will take a long time to accumulate to exceed the maxCount of fresco cache pool. |
Another issue I found #7408 caused by this bug. |
+1, this is a very big problem. |
@andreicoman11 Have you noticed this on Facebook's side? |
I think I have found the reason for this, see the mentioned bug: #8711 |
also having this issue, this is very critical, list view with any image set is broken after few usages |
I finally found something important. public synchronized boolean increase(Bitmap bitmap) {
final int bitmapSize = BitmapUtil.getSizeInBytes(bitmap);
if (mCount >= mMaxCount || mSize + bitmapSize > mMaxSize) {
return false;
}
mCount++;
mSize += bitmapSize;
Log.d("myfresco", "-"+mCount+"-"+mSize); ///add this===>
return true;
} Then I found the logging is weird. Then I add a method in FrescoModule.java in ReactAndroid @ReactMethod
public void clearCache() {
ImagePipeline imagePipeline = Fresco.getImagePipeline();
imagePipeline.clearCaches();
} And call it from JS side of react-native Platform.OS=='android' && BackAndroid.addEventListener('hardwareBackPress', ()=>{
NativeModules.FrescoModule.clearCache();
return false;
}
}); The quit behavior will not cause mSize and mCount to accumulate. It will always start counting from zero. |
And add clearCache at the reloading point options.put(
mApplicationContext.getString(R.string.catalyst_reloadjs), new DevOptionHandler() {
@Override
public void onOptionSelected() {
ImagePipeline imagePipeline = Fresco.getImagePipeline();
imagePipeline.clearCaches();
handleReloadJS();
}
}); in DevSupportManagerImpl.java The image not render problem could be solved. But!!!!!! The Fresco leaking problem is still there, after a few times of reloading the App will crash. |
I'm considering to repace fresco, how to you think how hard it will be to implement? |
From my experience this https://github.com/bumptech/glide works way more stable a bit slower on low end devices but no memory leaks so far and what is more important it shows images all the time not only first 3 times. |
@sneerin If you want to support only modern devices, it's not hard to write an ImageLoader/Cache. If you do, give the CSP/Actor a model a try, so you won't get up in multithreading issues. But keep in mind that Fresco has many many more features that would need a lot of time to replicate. So I think it's important that fresco, or whatever is causing these memory-issues get's fixed. |
Do you use a ScrollView? Or just simple As @fab1an suggested, looking at heap dumps can give clues what is holding on to the bitmaps and how many bitmaps are still in memory. @narychen seems to be loading images from a camera roll. If you have for example a grid view of small thumbnails and you load all full resolution images, this will easily result in an OOM. It would be great to have a simple way to repro this. |
Since most of the problems come from Fresco not properly releasing memory when ReactActivity is destroyed (via back button), would changing the behaviour of back button to not destroy the activity but to move it to background via But ofc we'll need to trust android will kill the process when it needs more memory.. |
@oprisnik No. I'm building an IM app with cameraRoll. You could select picture from cameraRoll to send. And the app shows a lot of pictures which could be from network or local disk. And it will also show gif pictures, not only png. |
@oprisnik One more question how to turn on recycling of view when use a ScrollView. |
I caught the crash exception info in Android monitor.
And the memory dump before crashing.
It seems the memory usage is not hight. My android phone has 3G RAM. |
Yeah, I think this could be a problem with the scroll / list component then? I think that |
I just ran into this issue on Android as well. Images just randomly doesn't render and the app has to be restarted to resolve the issues. Looking forward to see this issue resolved. <3 |
ScrollView? ListView? |
i use the 0.34.0 version of react-native and the newest version of Fresco, but this problem is still exist。 |
@MingYe-dz I think the problem that image cannot show will not happen in 0.34.0. This has been fixed by @oprisnik . But the memory still leaks and will finally cause app crash down. Could give some screenshot of what happened in your app? |
I have this problem too |
@Poordeveloper Which version ? |
@narychen "react-native": "0.37.0" |
@Poordeveloper Could you try the FrescoModule.clearCache() I mentioned above to see if it happens ? |
@narychen do you solve this problem? |
@iamdurui Yeah, I think the problem has been solved. |
I still have the same problem. I'm using React Native 0.39. I have bunch of images and when user clicks on one of those images it gets zoomed. The render function is as follows :
On iOS it works fine, like is should, but on android not. Only first time it renders the photo, second time it renders white screen, without photo. I've tried with adding Any idea? |
Anyone has solution for this? |
"react-native": "0..51-RC" |
It seems issue is still persist. Sometimes images does not load. Any solution? |
@keermanish please open a new issue with any details specific to your problem. |
It's a serious problem since the early version and never being solved.
Reloading of JS will quickly lead to this bug but it will always happen whether or not you do the reloading.
When you use back button to quit the app on android and re-launch it, the image will still not show. I think it is because Fresco will not be closed after you quit. It is running as long as your phone is on until you remove your app from the task manager of android.
This means your app will not show image after a period of time even if it doesn't have a lot of image to show.
Please give a high priority to this problem because it will never be production ready for react-native of android if the image will go away after a few times of uses.
The text was updated successfully, but these errors were encountered: