3

I have a dashboard, and on load it hits a database and gets a bunch of URLs, which are then rendered into IMG elements, like so:

<img src={Item.imageURL}/>

The issue is, that every time I open another route and then go back to the one with the images, the img components are being reloaded and the images are downloaded again. It results in icons visibly being loaded from top to bottom every time.

Is there a way to load these images the moment the URLs are retrieved from the database and then keep them in the cache, so that they will load immediately? Like I'd do import image from "./image.png" with local images.

almarc
  • 1,598
  • 3
  • 11
  • 31
  • Does this answer your question? [How do you cache an image in Javascript](https://stackoverflow.com/questions/10240110/how-do-you-cache-an-image-in-javascript) – sahasrara62 Jul 19 '22 at 12:29
  • Hey, unfortunately, it doesn't, because as I've said, the images are re-downloaded every time the route is rendered, so the cache doesn't seem to be working. – almarc Jul 20 '22 at 09:58

0 Answers0