Как лучше хранить оптимизированные изображения для вёрстки?

Question

[ARCHXTEKK]

Дело в том, что на одно изображение из макета в целях оптимизации сайта приходится хранить минимум 9 файлов:
1) исходное 2) x2 и x3 размеры для retina-дисплеев 3) webp и avif версии всех предыдущих изображений.

То есть к примеру из одного маленького hero.jpg мы получаем следующее:

1. hero.jpg
   
2. [e-mail]
   
3. [e-mail]
   
4. hero.webp
   
5. [e-mail]
   
6. [e-mail]
   
7. hero.avif
   
8. [e-mail]
   
9. [e-mail]
   

(9 файлов на одно изображение, и это ещё без mozjpeg и адаптивных картинок под разные устройства).

И тут возникает резонный вопрос - как хранить всё это многообразие, неужели просто в одной папке ./images? Ведь даже из 10 картинок в макете (а это на минуточку уровень небольшого лендинга) уже получается минимум 90 файлов.

Comments

[Ankhena]

неужели просто в одной папке ./images?

Кто же вам мешает разложить их по папкам, если в одной неудобно?
Например, по модулям.

[Сергей delphinpro]

а еще настроить конвертацию при сборке, и хранить только одно исходное изображение.

[DIVSIDE]

Ankhena, реально. Папки где-то плачут)