我對像這樣實現的圖片標籤很好奇。
<picture> <source srcset="path/img.webp" type="image/webp" /> <img src="path/img.jpg" alt="image" /> </picture>
對於客戶端，我理解如果瀏覽器可以處理webp，它將顯示從伺服器發送的webp圖像；否則，它將顯示同樣從伺服器發送的 jpg 圖像。
我想知道伺服器是否需要將兩張圖像都發送給客戶端，或者伺服器只發送一張客戶端可以處理的圖像，因為我的目標是伺服器頻寬優化。
它採用「惰性」方法。在
source元素「可用」之前，它不會要求source元素中指定的檔案。「可用」可能表示以下任何一項：
以 示範 為例https://www.w3schools.com/tags/tag_picture.asp" rel="nofollow noreferrer">W3Schools：
（下面是演示的副本）