Gallery of large images

[vbuch]

I'm having an issue with loading 3 relatively large images (1600px on the the larger size). After some debugging it turned out that the images are not loaded correctly in . That's probably related to facebook/react-native#10470

[Exilz]

I wasn't aware of this issue. If you investigated it, do you know if react-native's team is planning on fixing it soon ?
If not, do you have tests plans / ideas to "fix" it for this plugin ?

[vbuch]

It's more of an Android "problem". It is just that you need to understand how image rendering works and what amount of memory or processor it uses. Understanding that will help in making the correct decisions on how to resolve this.

There are a couple of things that should be noted:

• 1st and most important is to use resizeMethod="resize" for larger images.
• Another thing I tried is rendering only the images that are "around" the current page. So this would mean that if you're on page 3, you only mount pages 2, 3 and 4. When you go to page 2, you unmount page 4 and mount page 1.
• Something else that really helped in my case is: Since our app has the gallery as an overlay and we have a lot of other images rendered below it. So once we go into the gallery, we should unmount the images below as RN will render them and then overlay them and that costs processor and memory.

You may want to see our fork of this repo thou it is quite different already and doesn't seem like it is mergable back in here.

[chrusart]

Hi, we should give @vbuch fork a try, it's forked from this one and should be able to merge. Question is that features added to it will be used and not break other functionality. Can u make a PR @vbuch ? We will look at changes and discuss, maybe add some switch to enable or not your features and it can be merged back.
Loading second hi resolution photo for neighbour photos is a great enhancement, we can add configurable props how many photos around we want to download in advance or something like that if someone wants a different number.

I was thinking about loading hi res photo when user wants to zoom and probably it is easy to achieve with @vbuch enhancements, just when to trigger hi res photo downloading is different.
Just thinking that we need hi res photo when user want to zoom in and see more details.

[vbuch]

Hi @chrusart
I need to fix a thing before creating a PR.
What I've done with low res and high res is actually I use the images that were shown in the gallery view as low res. This way, if I use cache, I can depend on that and not load the low res images from a remote location. Then, when a hi res image is needed the low res ones are no longer used.
I'll try and prepare a PR ASAP.
Thank you for taking a look at my code.

[chrusart]

Do you use your own react-native-transformable-image repository @vbuch ? Cause i see imageComponent prop that is not in original. Just asking cause I also want to use custom image component.

EDIT: Ok, i see you have this repo forked as well.

[Exilz]

This should be much better with the v2.0.0.
You can try the demo in the dev branch. On my kinda old android, it handles this gallery of 14 images without hassle, some of them are in a quite high resolution (1920*1280).

Switching to FlatList really helped.

Please note that the development mode is significantly slower, due to the console logs being dispatched when navigating between images. They are sent from a dependency that we haven't put on this repo yet.

[vbuch]

@Exilz 2.1.0 most deff resolves this issue. Thank you for the support!