fix: too many onVisibleRangeUpdate event for a given position

orefalo · Oct 21, 2024 · 080143c · 080143c
1 parent d963650
commit 080143c
Showing 1 changed file with 19 additions and 9 deletions.
diff --git a/src/lib/VirtualListNew.svelte b/src/lib/VirtualListNew.svelte
@@ -67,6 +67,8 @@
     avgSizeInPx?: number;
     clientHeight?: number;
     clientWidth?: number;
+    startIdx?: number;
+    endIdx?: number;
   }
 
   // ====== PROPERTIES ================
@@ -260,17 +262,16 @@
 
   $effect(() => {
     //@ts-expect-error unused no side effect
-    scrollToIndex, scrollToAlignment, scrollToOffset, items.length, sizingCalculator;
+    scrollToIndex,
+      scrollToAlignment,
+      scrollToOffset,
+      items.length,
+      sizingCalculator,
+      startIdx,
+      endIdx;
     propsUpdated();
   });
 
-  $effect(() => {
-    if (onVisibleRangeUpdate) {
-      const vr = getVisibleRange(isHorizontal ? clientWidth : clientHeight, curState.offset);
-      onVisibleRangeUpdate(vr);
-    }
-  });
-
   $effect(() => {
     const { offset, scrollChangeReason } = curState;
 
@@ -324,6 +325,13 @@
       };
     }
 
+    if (onVisibleRangeUpdate) {
+      if (prevProps?.startIdx !== startIdx || prevProps?.endIdx !== endIdx) {
+        const vr = getVisibleRange(isHorizontal ? clientWidth : clientHeight, curState.offset);
+        onVisibleRangeUpdate(vr);
+      }
+    }
+
     prevProps = {
       scrollToIndex,
       scrollToAlignment,
@@ -332,7 +340,9 @@
       sizingCalculator,
       avgSizeInPx,
       clientHeight,
-      clientWidth
+      clientWidth,
+      startIdx,
+      endIdx
     };
   }