Как я могу заставить адаптивные изображения отправлять правильный размер файла для адаптивных изображений BootStrap?
У меня есть Мэтт Уиллкокс здорово адаптивные-образы работаю на моем сайте. Это работает так:
- Сервер доставляет изображение 800px.
- Adaptive-images перенаправляет изображение, которое не превышает ширину вашего разрешения
Проблема в том, что BootStrap отображает изображения в столбцах для рабочего стола и во всю ширину для планшета и мобильного телефона. Технически, Adaptive должен предоставлять изображения меньшего размера для рабочего стола, чем меньшие области просмотра. Google PageSpeed хлопает меня за это. У меня есть изображения размером 800px, уменьшенные до 150px или около того.
Я провел много исследований, но не могу найти подходящее решение. Стоит ли взламывать адаптивные изображения, чтобы посмотреть на функцию, отличную от ширины разрешения, чтобы получить правильное изображение? Есть ли другая библиотека для решения этой проблемы?
Решение
Так как разрешение в файлах cookie устанавливается через JS, вы можете попытаться переопределить код, указанный в шаг установки 3
Куки должны иметь более высокий приоритет в соответствии с этим:
Он обрабатывает случаи, когда нет набора файлов cookie; мобильные устройства получат самое маленькое изображение, а настольные устройства получат самое большое
РЕДАКТИРОВАТЬ Также я рекомендую обратить внимание на тег как он есть описано на странице проектов github Тем не менее, есть еще проблемы с поддержкой браузером этих функций, надеюсь, они будут исправлены в ближайшее время
Другие решения
Других решений пока нет …
detector