How to load and display different images depending on user settings in React?

Question

React

Hello everyone, I'm making a React application in which I use pictures. Pictures are stored in the project folder and loaded via require. Now I want to show different pictures to users in some places depending on their settings. The user settings are stored on the server and will be loaded into the application via useEffect when it is launched. The bottom line is that I want to make several such pictures, and it turns out that if one of the pictures is displayed to the user in a certain place, then the rest intended for him will never be shown. But nevertheless, they will be loaded by the browser and cached, which will lead to unnecessary traffic/memory waste. How can this be avoided?