Привет всем!
Есть проблема, которую пока не придумал как решить. Помогите советом.

Пациент https://bitly.su/9z2Oh

Есть страница сайта с большим количеством мини-карточек товаров, состоящих из фото, названия и кнопки купить.
Сайт на html + php, соответственно на одной странице выводится больше 200 таких карточек, может и больше. Таким образом страница насыщена изображениями, что очень сильно замедляет скорость загрузки сайта, хоть и фото - миниатюры, с максимальной высотой 300 пикселей, сжаты и т.д.

Получилось повысить скорость загрузки путем подключения ленивой загрузки фото через скрипт https://github.com/aFarkas/lazysizes

Но есть большой минус, на странице также используется навигационное меню по блокам, типа плавной прокрутки. Так вот при ее использовании скроллит не туда, так как изображения ниже области просмотра еще не загружены. Фиксированную высоту им указать не получится, потому что верстка адаптивная и при смене разрешений размеры изображений разные.

Как быть? Может есть более эффективное решение чем ленивая загрузка или есть идеи как доработать этот вариант?
Спасибо