react-native Images on Android only extremely low quality.

Description

I am trying to load high quality images in React Native for a chart application and I am getting low quality images being displayed on Android, Zooming in does not help either, instead it makes the issue worse. iOS is fine, but viewing the same image on Android gives dire results and does not look the same quality as iOS.

I have attached an Expo snack example so that you can compare and Zoom in to see the issue.

React Native version:

0.66

Steps To Reproduce

Provide a detailed list of steps that reproduce the issue.

Use a high quality PNG image.
Load the image in an Image Viewer or Image Tag.

Expected Results

Describe what you expected to happen.

I expect the image quality to be the same regardless of the platform.

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

https://snack.expo.dev/@joelpateljp/low-quality-image-android-example

Oct 15 '21 15:10 pateljoel

I’m sure I’m not the only one having this serious issue on Android, has there been any movement on this?

Oct 20 '21 00:10 pateljoel

Can you fix this issue? @ManishOffi

Oct 28 '21 10:10 pateljoel

Is there any update on this?

Nov 29 '21 14:11 pateljoel

My rn version is 0.63.

I got the same issue when I use big size an image.

Dec 20 '21 07:12 wayne-tt

It is facebook/fresco issue.

Dec 22 '21 04:12 wayne-tt

@wayne-tt I wrote a comment and the same Expo snack on the facebook/fresco repo https://github.com/facebook/fresco/issues/2397#issuecomment-993714092

Jan 04 '22 23:01 pateljoel

I am facing the same problem if you got the solution then please share it with me

Mar 13 '22 12:03 AKHACKER-program4hack

Same issue rn version is 0.64.3.

Mar 29 '22 19:03 tez123z

Same issue in "react-native": "0.68.0".

May 02 '22 09:05 liviu-padurariu

same issue 0.64.3

May 21 '22 16:05 saruults

same issue 0.64.3

Aug 12 '22 17:08 bodrius

Does anyone know whether the problem also exists using JPG images?

Aug 25 '22 08:08 Jablek98

Still a bug in 0.71.2. This has been a bug for many years before this particular issue was filed. (see https://github.com/facebook/fresco/issues/2397 https://github.com/facebook/react-native/issues/21301 etc).

Unfortunately over the years it hasn't been able to grab anyone at Facebook's attention who might know how to resolve it and community efforts haven't uncovered the source either. Some people have luck using react-native-fast-image or the new expo-image both of which use glide instead of fresco for handling the images on android.

It's a really difficult bug to deal with if you need to render high resolution images on Android. What's more frustrating is that everything works perfectly on iOS. At this point however after ~5 years of this bug being reported with no fix I think it's safe to say it's in the "won't fix" category and you're better off trying a workaround.

Feb 12 '23 18:02 evelant

Comment on the new Expo Image prop: https://github.com/facebook/fresco/issues/2397#issuecomment-1527009797

Apr 28 '23 05:04 timoisalive

I had a look and I can only see this PR https://github.com/facebook/fresco/pull/2500 which aims to solve the low quality issue here: https://github.com/facebook/fresco/issues/2397 but I haven't tried it yet.

This issue is very critical since images on Android is the only platform that has this very low quality images.

If anyone has any update or workaround, this would be very welcome.

Aug 14 '23 10:08 pateljoel

@evelant Looks like this is making some progress here that might lead to this issue being resolved on fresco's side. https://github.com/facebook/fresco/pull/2500

Jan 28 '24 08:01 pateljoel