Элемент picture: WebP, AVIF и JPEG fallback без ломки кэша

Браузер выбирает первый поддерживаемый <source>; финальный <img> обязан быть совместим со старыми клиентами.

Указывайте type="image/avif" и image/webp" явно, чтобы не полагаться на расширение файла.

- [Serve images with WebP — web.dev](https://web.dev/articles/serve-images-webp) — picture, source и fallback.

- [The picture element — MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture) — Синтаксис и responsive art direction.

---

## CDN

При переписывании по заголовку Accept не забывайте Vary: Accept для кэшей.

Генерируйте AVIF/WebP на билде для тяжёлых hero, чтобы не жечь CPU на запросе.