Проблема производительности. Бесконечный горизонтальный скролл с динамическим размером элементов

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

введите сюда описание изображения

Сделал контейнер с overflow: hidden, внутри него flex контейнер. Внутреннему - интервалом изменяю translateX и на каждой итерации пробегаю по массиву элементов с проверкой, как далеко от центра они находятся, и даю соответствующие значения размеров. (Прозрачность реализовал через градиент)

Проблема в производительности. Вычислять и изменять размеры при каждом движении мыши, даже с применением debounce, крайне накладно. Есть ли иное решение задачи, при условии, что геометрию логотипов непременно нужно сохранить?


Ответы (0 шт):