@infinite-list/data-model - npm Package Compare versions

Comparing version 0.2.31 to 0.2.32-perf.1

dist/ItemMetaStateEventHelper.d.ts

@@ -12,2 +12,5 @@ import { StateEventListener } from './types';
     private _reusableEventListenerMap;
+    private _callbackId;
+    private _setupCallbackMs;
+    private _callbackStartMinMs;
     constructor(props: {
@@ -31,5 +34,6 @@ key: string;
     listenerGuard(cb: StateEventListener): boolean;
+    cancelIdleCallbackPolyfill(callbackId: number): void;
     trigger(value: boolean): void;
-    _trigger(value: any): void;
+    _trigger(value: boolean, immediately: boolean): void;
 }
 export default ItemMetaStateEventHelper;

dist/viewable/OnEndReachedHelper.d.ts

@@ -50,2 +50,3 @@ import Batchinator from '@x-oasis/batchinator';
     updateStack(distanceFromEnd: number): void;
+    timeoutTrailingHandler(): void;
     onEndReachedHandler(opts: {
@@ -52,0 +53,0 @@ distanceFromEnd: number;

package.json

 {
   "name": "@infinite-list/data-model",
-  "version": "0.2.31",
+  "version": "0.2.32-perf.1",
   "files": [
@@ -5,0 +5,0 @@ "dist",

src/ItemMetaStateEventHelper.ts

@@ -14,2 +14,5 @@ import Batchinator from '@x-oasis/batchinator';
   private _reusableEventListenerMap = new Map();
+  private _callbackId: number;
+  private _setupCallbackMs: number;
+  private _callbackStartMinMs: number;
 
@@ -128,2 +131,10 @@ constructor(props: {
 
+  cancelIdleCallbackPolyfill(callbackId: number) {
+    // @ts-ignore
+    if (typeof cancelIdleCallback === 'function') {
+      // @ts-ignore
+      cancelIdleCallback(callbackId);
+    }
+  }
+
   trigger(value: boolean) {
@@ -133,3 +144,3 @@ const shouldPerformScheduler = this.guard();
     if (value && !this._batchUpdateEnabled) {
-      this._trigger(value);
+      this._trigger(value, true);
       return;
@@ -144,12 +155,43 @@ }
 
-  _trigger(value) {
-    if (this._value !== value) {
-      this._listeners.forEach((cb) => {
-        if (this.listenerGuard(cb)) {
-          this.incrementHandleCount(cb);
-          cb(value);
+  _trigger(value: boolean, immediately: boolean) {
+    const now = Date.now();
+
+    if (immediately) {
+      this._callbackStartMinMs = now;
+      if (this._callbackId) {
+        this.cancelIdleCallbackPolyfill(this._callbackId);
+        this._callbackId = null;
+      }
+      if (this._value !== value) {
+        this._listeners.forEach((cb) => {
+          if (this.listenerGuard(cb)) {
+            this.incrementHandleCount(cb);
+            cb(value);
+          }
+        });
+      }
+      this._value = value;
+    } else {
+      if (this._callbackId) {
+        this.cancelIdleCallbackPolyfill(this._callbackId);
+        this._callbackId = null;
+      }
+
+      this._setupCallbackMs = now;
+      this._callbackStartMinMs = now;
+
+      // @ts-ignore
+      this._callbackId = requestIdleCallback(() => {
+        if (now < this._callbackStartMinMs) return;
+        if (this._value !== value) {
+          this._listeners.forEach((cb) => {
+            if (this.listenerGuard(cb)) {
+              this.incrementHandleCount(cb);
+              cb(value);
+            }
+          });
         }
+        this._value = value;
       });
     }
-    this._value = value;
   }
@@ -156,0 +198,0 @@ }

src/viewable/OnEndReachedHelper.ts

@@ -251,2 +251,9 @@ import Batchinator from '@x-oasis/batchinator';
 
+  timeoutTrailingHandler() {
+    if (this._scrollMetrics) {
+      const info = this.perform(this._scrollMetrics);
+      this.performEndReached(info);
+    }
+  }
+
   onEndReachedHandler(opts: { distanceFromEnd: number }) {
@@ -261,2 +268,3 @@ if (typeof this.onEndReached !== 'function') return;
       this.timeoutReleaseHandlerMutex(now);
+      this.timeoutTrailingHandler();
     }, this.onEndReachedHandlerTimeoutThreshold);
@@ -263,0 +271,0 @@ this._currentMutexMS = now;

No alert changes

Improved metrics

Total package byte prevSize

1785369

increased by0.73%

Lines of code

21030

increased by0.63%

No dependency changes