smarter about rerendering tablerow based on coordinate changes

fullcalendar · Jan 9, 2023 · 8fdd30f · 8fdd30f
1 parent 1556a5c
commit 8fdd30f
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 9 deletions.
diff --git a/packages/core/src/common/PositionCache.ts b/packages/core/src/common/PositionCache.ts
@@ -99,4 +99,27 @@ export class PositionCache {
   getHeight(topIndex: number) {
     return this.bottoms[topIndex] - this.tops[topIndex]
   }
+
+  similarTo(otherCache: PositionCache) {
+    return similarNumArrays(this.tops || [], otherCache.tops || []) &&
+      similarNumArrays(this.bottoms || [], otherCache.bottoms || []) &&
+      similarNumArrays(this.lefts || [], otherCache.lefts || []) &&
+      similarNumArrays(this.rights || [], otherCache.rights || [])
+  }
+}
+
+function similarNumArrays(a: number[], b: number[]): boolean {
+  const len = a.length
+
+  if (len !== b.length) {
+    return false
+  }
+
+  for (let i = 0; i < len; i++) {
+    if (Math.round(a[i]) !== Math.round(b[i])) {
+      return false
+    }
+  }
+
+  return true
 }
diff --git a/packages/daygrid/src/TableRow.tsx b/packages/daygrid/src/TableRow.tsx
@@ -318,7 +318,7 @@ export class TableRow extends DateComponent<TableRowProps, TableRowState> {
   }
 
   updateSizing(isExternalSizingChange) {
-    let { props, frameElRefs } = this
+    let { props, state, frameElRefs } = this
 
     if (
       !props.forPrint &&
@@ -329,15 +329,23 @@ export class TableRow extends DateComponent<TableRowProps, TableRowState> {
 
         if (frameEls.length) {
           let originEl = this.rootElRef.current
+          let newPositionCache = new PositionCache(
+            originEl,
+            frameEls,
+            true, // isHorizontal
+            false,
+          )
 
-          this.setState({ // will trigger isCellPositionsChanged...
-            framePositions: new PositionCache(
-              originEl,
-              frameEls,
-              true, // isHorizontal
-              false,
-            ),
-          })
+          if (!state.framePositions || !state.framePositions.similarTo(newPositionCache)) {
+            this.setState({ // will trigger isCellPositionsChanged...
+              framePositions: new PositionCache(
+                originEl,
+                frameEls,
+                true, // isHorizontal
+                false,
+              ),
+            })
+          }
         }
       }