I'm curious about image tags implemented like this.

<picture>
  <source srcset="path/img.webp" type="image/webp" />
  <img src="path/img.jpg" alt="image" />
</picture>

For the client, I understand that if the browser can handle webp, it will display the webp image sent from the server; otherwise, it will display the jpg image also sent from the server.

I want to know if the server needs to send both images to the client or if the server only sends one image that the client can handle since my goal is server bandwidth optimization.