Problems requiring too many images in React Native

Question

I have a javascript file that looks like below. He has a lot of objects (1000+). Since we cannot use a dynamic name for images in a-native reaction, this is my job.

"grinning": { "image": require('./images/1f600.png'), "shortname": ":grinning:", } 

I need this file in some other native function reaction and a loop to display all the images. But an internal error requires too many images in the javascript file.

 {"type":"InternalError","message":"react-packager has encountered an internal error, please check your terminal error output for details"} 

The terminal says

 fs operation timeout 

This works if I delete multiple entries from a file.

Any suggestion or best approach

Answer 1

Known issues with the Fresco library, which is responsible for image processing and memory limits:

PNG image memory issues

React Native Android relies on Fresco to download and display images. Currently, we have disabled downsampling because it is experimental, so you can run the problem memory when loading large PNG images.

So maybe try compressing your images if you can, and demand them only when they should be displayed.

You should also check the bug tracker . Here is a comparable problem and its fix:

@ phones24 wrote:

I optimized my application so as not to cache too many images. I also added some more JPEG compression and scale the image a bit. I also wrote a path that adds error information to the event.