Как исправить торможение скролла jquery в framework Blazor WASM?

Question

[DD-var]

В обычном html все работает можно сказать идеально без мелких тормозов. но в WASM происходит проблема, значение повторяется у scrollLeft и обновление элемента происходит когда только отпустишь лкм, как это можно исправить?
lastValue= значение которое должно быть
scroll Left= значени element.scrollLeft

Код:

<style>
.slider .slides {
    display: grid;
    grid-auto-flow: column;
    overflow: hidden;
}

.slider .slides .slide img {
    width: 400px;
}
</style>
<div class="slider">
    <div class="slides" id="slider">
        <div class="slide"><img src="https://vignette.wikia.nocookie.net/the-long-dark/images/6/66/%D0%9F%D1%80%D0%BE%D1%81%D1%82%D0%BE_%D0%BB%D0%BE%D1%81%D1%8C.jpg/revision/latest?cb=20191214081501&path-prefix=ru"></div>
        <div class="slide"><img src="https://vignette.wikia.nocookie.net/the-long-dark/images/6/66/%D0%9F%D1%80%D0%BE%D1%81%D1%82%D0%BE_%D0%BB%D0%BE%D1%81%D1%8C.jpg/revision/latest?cb=20191214081501&path-prefix=ru"></div>
        <div class="slide"><img src="https://vignette.wikia.nocookie.net/the-long-dark/images/6/66/%D0%9F%D1%80%D0%BE%D1%81%D1%82%D0%BE_%D0%BB%D0%BE%D1%81%D1%8C.jpg/revision/latest?cb=20191214081501&path-prefix=ru"></div>
        <div class="slide"><img src="https://vignette.wikia.nocookie.net/the-long-dark/images/6/66/%D0%9F%D1%80%D0%BE%D1%81%D1%82%D0%BE_%D0%BB%D0%BE%D1%81%D1%8C.jpg/revision/latest?cb=20191214081501&path-prefix=ru"></div>
        <div class="slide"><img src="https://vignette.wikia.nocookie.net/the-long-dark/images/6/66/%D0%9F%D1%80%D0%BE%D1%81%D1%82%D0%BE_%D0%BB%D0%BE%D1%81%D1%8C.jpg/revision/latest?cb=20191214081501&path-prefix=ru"></div>
        <div class="slide"><img src="https://vignette.wikia.nocookie.net/the-long-dark/images/6/66/%D0%9F%D1%80%D0%BE%D1%81%D1%82%D0%BE_%D0%BB%D0%BE%D1%81%D1%8C.jpg/revision/latest?cb=20191214081501&path-prefix=ru"></div>
    </div>
</div>

<script>
let isMoving = false;
let lastMouseX = 0;

const slider = document.querySelector('#slider');

function moveSlider(delta) {
    slider.scrollLeft += delta;
}

document.addEventListener('mousedown', (event) => {
    isMoving = true;
    lastMouseX = event.clientX; // Запоминаем начальную позицию мыши
});

document.addEventListener('mouseup', () => {
    isMoving = false; // Останавливаем движение при отпускании кнопки мыши
});

document.addEventListener('mousemove', (event) => {
    if (isMoving) {
        const deltaX = event.clientX - lastMouseX; // Вычисляем изменение позиции мыши
        moveSlider(deltaX); // Перемещаем слайдер
        lastMouseX = event.clientX; // Обновляем последнюю позицию мыши
    }
});
</script>