Images not rendering on Android

Hi all, my apologies if this question is redundant or too novice but I wasn’t able to find an answer here or on SO. Thank you in advance for your guidance.

I’m rendering about 30 images using ListItem from react-native-elements but the images don’t show up on Android, however, they render fine on iOS). I know that memory is handled differently on Android, so I changed all images to a 1kb tester image which fixed the issue. Right now, I’ve been able to compress my images to ~20kb each on average but they still don’t display on Android. I’m not sure I’ll be able to compress lower than that, so I was hoping to change my code or gain some insight here.

Code is below. Just to reiterate – this renders w/o an issue on iOS.

_renderContent = () => => {
      const { checkboxes } = this.state;
      return (
              source={{ uri: top.url }}
                checkboxes && checkboxes.includes(
                  ? 'Added'
                  : 'Click to Add'
              onPress={() => {
              checked={checkboxes && checkboxes.includes( ? true : false}

I’m mapping through json data which holds the image url.

Example url:

hey @nethanelkohen , just to make sure that this is a performance issue – rendering with a couple images work on Android (ie) 1-2 images?

could you provide a snack with the code that doesnt work on android? (

1 Like

thanks for getting back to me, @quinlanj. It seems like it is a performance issue with the ListItem way I was rendering images. I’ve since got it to work.

oh hm… what ended up being the fix, @nethanelkohen?

sorry for the late reply! I believe it was the way I wrote my code. Didn’t use FlatList.

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.