Mobile first approach | Product Preview Card Component | Floats

Hey There! Solution for Product Preview Card Component. CRITICISM NEEDED.

There are two images provided in this project, a mobile image, and a desktop image. I've used CSS's Display property to hide one image depending on the view of the screen, a normal responsive effect. In the index.html I've added both the <img> tags. The problem with this approach is that the loading time will be compromised. As the browser will load both the images. My question, is there a better approach to this problem?