v1.0.2 обновление от 06-Июл-2022

[ab.support.serhii]

Дорогие друзья, сегодня мы выпустили релиз обновления:

Lazy load изображений v1.0.2 от 06-Июл-2022

Новые возможности и улучшения:
[+] Добавлена совместимость с CS-Cart 4.15.1.

Исправления ошибок:
[!] Не загруженные баннеры в шаблоне "Карусель" смещали контент, расположенный ниже. Исправлено.

Обновления доступны всем пользователям с активной подпиской, производятся через Центр обновлений CS-Cart.

Хотите, мы оповестим Вас о следующем обновлении? Подпишитесь на наши каналы для анонсов:
- Telegram
- WhatsApp
- YouTube

[KirillLB]

На демо-магазине в настройках модуля "AB: Lazy load изображений" поставил для теста минимальные значения:
Подгружать изображения на 5px  http://joxi.ru/Drl0EzNHd0Q5Xr

На странице товара проверяю сколько загрузилось товарных миниатюр.
Загрузились все http://joxi.ru/l2Zk3L1iVEZO4A

Аналогичная ситуация, когда миниатюр товара 10-12 штук.  Грузятся все. 

Отложенная загрузка в настройках темы включена http://joxi.ru/V2VOG5auGKWNDA

Разве не должна была загрузить только первая? Или я что-то не понимаю в механике работы модуля?

[ab.support.serhii]

19 часов назад, KirillLB сказал:

Разве не должна была загрузить только первая? Или я что-то не понимаю в механике работы модуля?

Не совсем правильно.

Принцип работы отложенной загрузки - полностью загружаются те изображения, которые сразу видимы на экране,

http://i.abt.team/serj/20230327_141038.jpg

http://i.abt.team/serj/20230327_140843.jpg

а остальные изображения - заменяются на плейсхолдер (например 1x1 px в несколько байт).

http://i.abt.team/serj/20230327_140936.jpg

По мере скроллинга загружаются нужные изображения, плейсхолдер заменяется.

Вы же показываете на скриншотах элементы cm-item-gallery - они и не должны никуда деваться, просто в них изображения должны быть заменены на изображение плейсхолдера - модуль же называется Lazy load изображений.

 

Другой вопрос, что конкретно в этом случае загружается несколько больше изображений, чем следовало бы: вместо четырёх - семь, только с восьмого и дальше - подменяется на плейсхолдер.

Связано с тем, что, грубо говоря, на этапе загрузки/формирования страницы изображения этой галереи сначала загружаются одним длинным элементом и только потом он сворачивается в "аккордеон" скриптом - и поэтому видимыми считаются больше итоговых четырёх изображений.

Есть в планах исследовать это поведение и, если возможно, оптимизировать.

[KirillLB]

@ab.support.serj Спасибо! Теперь понял.

[Гость]

Подскажите, возможно я шибаюсь про модуль lazy-load, но вроде как читал на форуме за 2021 год еще, что в поиск летят страницы типа:

ivborw0kggoaaaansuheugaaaaqaaaaecaqaaaad+fb1aaaadkleqvr42mnkgajg3awaah4abwjfc8iaaaaasuvork5cyii=

 

/zapchasti/velopokryshki/poluslik/ivborw0kggoaaaansuheugaaaaqaaaaecaqaaaad%20fb1aaaadkleqvr42mnkgajg3awaah4abwjfc8iaaaaasuvork5cyii=/

Вроде как пишут из-за lazy-load, типо это закодированный пиксель??? Просто сейчас эти страницы также насколько я вижу попадают в поиск с 404 ошибкой.  

[ab.support.serhii]

@maksimist там же была и рекомендация: указать статическое изображение вместо пикселя в настройках модуля.

[Гость]

@ab.support.serj У меня ранее так и было указано, но пришлось убрать, т.к. когда указываешь свое изображение 1px x 1px прозрачный фон, то в главном меню вместо иконок черные квадраты были, до того момента пока иконки погрузятся.  И еще что то было но уже не помню. Может какое то не такое изображение я ставлю? 

[ab.support.serhii]

16 минут назад, maksimist сказал:

Может какое то не такое изображение я ставлю? 

Не могу знать ответ на этот вопрос.

Можно тут сгенерировать и скачать в png, 68 байт выходит:

https://png-pixel.com/

[Гость]

@ab.support.serj Спасибо, вроде нет чёрных квадратов как раньше. Посмотрим как будет.  Прикольный сервис.

[KirillLB]

@ab.support.serj Помогите, пожалуйста, понять два момента:

1) Почему на тестовом магазине вот этот товар загружается долго?
https://abd-854c8ebb7c.demos.abt.team/ru/odezhda/obuv/adizero-rush-shoes/ 
Понятно что изображения большие и их иного, но включена же конвертация в webp и lazyload активен.

 

2) Как сделать так, чтобы изображение занимало всю отведенную ему площадь https://skr.sh/sN8RrG7xX7T ?

Изменение настройки иконок все равно дает уменьшенное изображение https://skr.sh/sN80qxrcltO    

[ab.support.serhii]

17 часов назад, KirillLB сказал:

Почему на тестовом магазине вот этот товар загружается долго?

Не вижу чтобы прям долго. Разница если и есть, то в доли секунды.

http://i.abt.team/serj/20231206_121019.mp4

17 часов назад, KirillLB сказал:

Как сделать так, чтобы изображение занимало всю отведенную ему площадь

Загружать изображения в товар с размерами, пропорциональными указанным настройкам.

Если указано, например, 800х600, то изображение должно быть минимум х2 (для Retina, 4K и прочих экранов высокой плотности пикселей).

(800х600)х2=1600х1200

А указанное изображение имеет другие пропорции и размер 1200х800.

https://abd-854c8ebb7c.demos.abt.team/images/detailed/9/Roza_vetrov__19_.jpg

Соответственно, чтобы сделать из 1200->1600, а из 800->1200 на недостающее место CS-Cart производит заливку фона, обычно белого.

http://i.abt.team/serj/20231206_121921.jpg

Иного способа нет, потому что вариант деформировать изображение и подгонять его под нужные размеры даже не рассматривается.

[KirillLB]

В 06.12.2023 в 13:27, ab.support.serj сказал:

Не вижу чтобы прям долго. Разница если и есть, то в доли секунды.

http://i.abt.team/serj/20231206_121019.mp4

Загружать изображения в товар с размерами, пропорциональными указанным настройкам.

Если указано, например, 800х600, то изображение должно быть минимум х2 (для Retina, 4K и прочих экранов высокой плотности пикселей).

(800х600)х2=1600х1200

А указанное изображение имеет другие пропорции и размер 1200х800.

https://abd-854c8ebb7c.demos.abt.team/images/detailed/9/Roza_vetrov__19_.jpg

Соответственно, чтобы сделать из 1200->1600, а из 800->1200 на недостающее место CS-Cart производит заливку фона, обычно белого.

http://i.abt.team/serj/20231206_121921.jpg

Иного способа нет, потому что вариант деформировать изображение и подгонять его под нужные размеры даже не рассматривается.

Спасибо за такой подробный ответ! А если модуль поддержки Retina экранов отключить, изображения будут подстраиваться под указанные 800х600?

[ab.support.serhii]

@KirillLB думаю, это не лучшая идея, так как сейчас практически все современные девайсы HiDPI.

Тогда только исключится этап х2:

В 06.12.2023 в 12:27, ab.support.serj сказал:

Если указано, например, 800х600, то изображение должно быть минимум х2 (для Retina, 4K и прочих экранов высокой плотности пикселей).

(800х600)х2=1600х1200

Но если в настройках будет, допустим, 435х537 (как по умолчанию),

http://i.abt.team/serj/20231208_181706.jpg

а оригинал изображения - 400х500, то дорисовка фона никуда не денется.

Ну и если пропорции другие - аналогично

[KirillLB]

@ab.support.serj  насчет решения этой проблемы:
 

Цитата

Другой вопрос, что конкретно в этом случае загружается несколько больше изображений, чем следовало бы: вместо четырёх - семь, только с восьмого и дальше - подменяется на плейсхолдер.

Связано с тем, что, грубо говоря, на этапе загрузки/формирования страницы изображения этой галереи сначала загружаются одним длинным элементом и только потом он сворачивается в "аккордеон" скриптом - и поэтому видимыми считаются больше итоговых четырёх изображений.

Есть в планах исследовать это поведение и, если возможно, оптимизировать.

Может сделать чтобы галерея мини-иконок располагалась не слева, как сейчас, от основного фото товара, а справа? Тогда, как я понимаю, на этапе загрузки/формирования страницы, сначала будет грузиться основное фото, а галерея будет формироваться за пределами первого экрана без подгрузки лишних миниатюр.

[ab.support.serhii]

@KirillLB вряд ли это поможет.

 

[KirillLB]

@ab.support.serhii Скажите, пожалуйста, в случае с отображением мини-иконок в списке товаров в виде галереи https://skr.sh/sQSFEetUE2H, какая механика действует при загрузке изображений?
То есть, если у товара 15-20 изображений, как они будут подгружаться в галерею мини-иконок в списке товаров?

[ab.support.serhii]

@KirillLB ограничение в 6 штук, если я правильно понял вопрос.

http://i.abt.team/serj/2024_06_28_1103583003.jpg

http://i.abt.team/serj/2024_06_28_9955446108.jpg