Оптимизация производительности Vue.js приложений: Практическое руководство

[FedorCV]

Пожалуй одна из самых базовых частей разработки

[Arkham]

Для отображения webp использовать picture - это как использовать экскаватор вместо ложки. Проверьте в Accept заголовке поддержку webp, сохраните в состояние, и вставляйте в img ссылку сразу в нужном расширении.

[ovchinnikov-lxs]

Согласен, работа с изображениями — это отдельная история, требующая более детального подхода. В своей практике я использую Nuxt вместе с модулем @nuxt/image и кастомным компонентом для изображений. Это позволяет получить полный контроль над всеми состояниями и отображением изображений — от работы с медиа-запросами до сжатия и оптимизации. Если интересно, могу попробовать написать статью на эту тему.