React: Preload Images

 React: Preload Images

I had a situation that lot of time taken to load images, which are loaded dynamically. One solution was to preload the images whenever we get the URL so that images will be available in cache and it will load quickly.

Below solution worked

useEffect(()=>{

images.forEach((image) => {

const img = new Image();

img.src = baseurl + image.fileName;

});

}, [])

References:

https://stackoverflow.com/questions/42615556/how-to-preload-images-in-react-js