Google page speed говорит что они большие. Я могу как-то через мидл варе сделать конвертер картинок. Чтоб они конвертировались на лету для телефона и для компа с разными параметрами.. И как потом их кешировать ?
https://image.intervention.io/v2/introduction/installation - вот есть пакет. Реализуйте экшон с ресайзом и конвертацией в нужыне форматы. При обращении с фронта - проверяете файлы - если есть - отдаёте , если нет - создаете и отадёте.
Можно и через мидлварю, но тогда будут проблемы: 1. Нужно на лету парсить user agent с целью понять с мобилы запрос или нет (это всегда); 2. Проверить существование обрезанного файла; 3. Если файл не существует - на лету его обрезать (https://image.intervention.io/v2/usage/cache) По времени первая нарезка ещё больше займёт при отрисовки страницы. Поэтому лучше резать при создании записей, а фронтенд сам на стороне браузера сможет определить мобила это или нет, и отправит либо один урл, либо другой для загрузки того или иного изображения. А вообще для веба рекомендую формат картинок webp и формат видео webm. У них вес в разы меньше jpg, не говоря уже о png.
а для SEO урлы картинок должны быть одинаковые? и просто в контроллере отдать правильный байты? или на фронте прям ставить разные урлы?
клиент должен иметь возможность закешировать изобрадение. поэтому конечно разные
В идеале разные. Грубо говоря: device.isMobile ? '/images/some.webp' : '/images/some-small.webp' Или device.isMobile ? '/images/some.webp' : '/images/some.webp?mobile=1'
Если браузер закэширует изображение у себя (а он закэширует), поэтому лучше разные.
https://zaiste.net/network/nginx/howtos/howto-resize-on-the-fly-cache-images-nginx/
Обсуждают сегодня