api прилетает ссылка на png файл.
<nuxt-img
:src="image"
alt="some_text"
format="webp"
quality="80"
/>
Картинка отображается но изменение размера и качество не происходит?
Как работать с внешними файлами ?
Как настроить ?
Заранее благодарю!
Ни кто не работал с ....?
Это не будет работать в риалтайме, nuxt-image оптимизирует картинки в процессе сборки вашего приложения
Поэтому картинки должны заранее лежать в определенной директорий? Какая есть альтернатива(пакет, инструмент) ?
Вообще возможно оптимизировать картинку в реалтайме ссылаясь на другой домен где расположена картинка?
Как вы себе это представляете?
Это вообще для меня новая, сегодняшняя тема, вообще не представляю )) Пожалуйста объясните процесс если есть возможность
Даже если можно написать какой то скрипт, который после http запроса будет ловить картинку и оптимизировать ее, это дико, потому что оптимизация картинки это определенный процесс, который занимает время, что вам это даст в конце?) Если картинка долго грузится сейчас из-за размера, она в теории будет грузится долго из-за того что ее на лету оптимизируют
Тула которую вы используете 100% не подходит для этого, она работает только с заранее сохраненными картинками в директории, так работают абсолютно все плагины под сборщики
какой инструмент подойдет? Можете помочь, посоветовать пути решения задачи? Задача: грузятся из внешнего ресурса тяжелые фото, нужно их оптимизировать, уменшить размер без потери качество и с возможностью responsive
на бэкенде где их принимаете сразу сжимайте, а на фронте подставляйте только нужную ссылку
Все логично! Смысл сжимать на фронте, если из бека приходится качать тяжоловесныую картинку ?
Как на этот ресурс картинки попадают? Если это какая-то цмска и есть человек который их туда грузит то самый простой способ - научить человека пользоваться squoosh или другими тулзами
Я не в курсе как на удаленный ресурс попадают картинки. Фронт получает только ссылку на картинку. По задаче, на нуксте нужно оптимизировать эту картинку
проксировать придется через серверную часть и там пережимать, но node.js не лучшеее решение для таких операций
А задачу «оптимизировать на nuxt» Вы ставили ?
Можете сказать тому человеку, который ставил задачу, что на наксте этого сделать нельзя, аргументы выше в чате)
А у вас spa, ssr или ssg? В теории в режиме ssg можно такое реализовать
Каждая задача должна решатся на своём уровне . Если картинки лежат не на фронте , то и не дело фронта их сжимать в рантайме , такого никто не делает
Тогда вы ничего не можете сделать)
Как можно? Хотя бы чтобы я понимал какие есть варианты и почему это не вариант?
Есть вот такой пакет https://www.npmjs.com/package/imagemin Если я правильно понимаю такие пакеты используются на фронте если картинка статичная или например пользователь грузит картинку через инпут и сжимает перед отправкой на сервер ?
Кстати сейчас на Nuxt Nation показывают про изображения, и там об оптимизации изображений на внешнем ресурсе. Модуль @nuxt/image и там указывается в опциях домены для которых нужно или разрешено оптимизировать изображения
Не успел по ходу (( Модуль @nuxt/image имеет настройку https://image.nuxtjs.org/api/options/#domains но почему то не работает должным обратом
Обсуждают сегодня