How to cache an image?

Question

React

Image paths come via the API, in the component I render like this:

const Poster = ({ result }) => {
  return (
    <>
      {result.path ? (
        <img
          src={`https://image.tmdb.org/t/p/w300${result.path}`}
          alt="Изображение"
        />
      ) : (
        <></>
      )}
    </>
  );
};

Because of this, the image is reloaded with each render (even if the path has not changed). How to fix it?
That is, how to stop loading the image again after each render if the path has not changed?

Answer 1

If everything is correct in the server response header, if the image name matches, and if the cache is not forcibly disabled on the browser side, the image, and indeed any other resource, should be taken from the browser cache.