Merge pull request #1193 from NicoPennec/fix/firefox-crash

Reduce Firefox freezes on macOS
cgwire · Sep 20, 2023 · ec91d44 · ec91d44
2 parents a54209b + 67c5058
commit ec91d44
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 29 deletions.
diff --git a/src/components/previews/PictureViewer.vue b/src/components/previews/PictureViewer.vue
@@ -281,7 +281,16 @@ export default {
 
         this.resetPanZoom()
 
-        this.$emit('size-changed', { width, height, top, left })
+        if (
+          !this.previousDimensions ||
+          this.previousDimensions.width !== width ||
+          this.previousDimensions.height !== height ||
+          this.previousDimensions.left !== left ||
+          this.previousDimensions.top !== top
+        ) {
+          this.$emit('size-changed', { width, height, top, left })
+        }
+        this.previousDimensions = { width, height, top, left }
       }
     },
 

diff --git a/src/components/previews/PreviewPlayer.vue b/src/components/previews/PreviewPlayer.vue
@@ -1122,34 +1122,31 @@ export default {
     },
 
     fixCanvasSize(dimensions) {
-      if (this.fabricCanvas) {
-        const { height, left, top, width } = dimensions
-
-        this.fabricCanvas.setDimensions({ width, height })
-        this.fabricCanvas.width = width
-        this.fabricCanvas.height = height
-
-        if (this.canvasWrapper) {
-          this.canvasWrapper.style.top = top + 'px'
-          this.canvasWrapper.style.left = left + 'px'
-          this.canvasWrapper.style.width = width + 'px'
-          this.canvasWrapper.style.height = height + 'px'
-          setTimeout(() => {
-            this.fabricCanvas.calcOffset()
-            this.fabricCanvas.setDimensions({ width, height })
-            this.width = this.getDimensions().width
-            if (this.isComparing && !this.isComparisonOverlay) {
-              this.canvasComparisonWrapper.style.top = top + 'px'
-              this.canvasComparisonWrapper.style.left = left + width + 'px'
-              this.canvasComparisonWrapper.style.width = width + 'px'
-              this.canvasComparisonWrapper.style.height = height + 'px'
-              this.fabricCanvasComparison.calcOffset()
-              this.fabricCanvasComparison.setDimensions({ width, height })
-            }
-            this.$nextTick(this.refreshCanvas())
-          }, 10)
-        }
+      if (!this.fabricCanvas) {
+        return
       }
+
+      const { height, left, top, width } = dimensions
+
+      this.canvasWrapper.style.top = top + 'px'
+      this.canvasWrapper.style.left = left + 'px'
+      this.canvasWrapper.style.width = width + 'px'
+      this.canvasWrapper.style.height = height + 'px'
+      // const calcOffset = this.fabricCanvas.calcOffset()
+      this.fabricCanvas.setDimensions({ width, height })
+
+      this.width = this.getDimensions().width
+
+      if (this.isComparing && !this.isComparisonOverlay) {
+        this.canvasComparisonWrapper.style.top = top + 'px'
+        this.canvasComparisonWrapper.style.left = left + width + 'px'
+        this.canvasComparisonWrapper.style.width = width + 'px'
+        this.canvasComparisonWrapper.style.height = height + 'px'
+        // this.fabricCanvasComparison.calcOffset()
+        this.fabricCanvasComparison.setDimensions({ width, height })
+      }
+
+      this.refreshCanvas()
     },
 
     // Screen

diff --git a/src/components/previews/VideoViewer.vue b/src/components/previews/VideoViewer.vue
@@ -380,7 +380,17 @@ export default {
         const left = videoPosition.left - containerPosition.left
         width = videoPosition.width
         height = videoPosition.height
-        this.$emit('size-changed', { width, height, top, left })
+
+        if (
+          !this.previousDimensions ||
+          this.previousDimensions.width !== width ||
+          this.previousDimensions.height !== height ||
+          this.previousDimensions.left !== left ||
+          this.previousDimensions.top !== top
+        ) {
+          this.$emit('size-changed', { width, height, top, left })
+        }
+        this.previousDimensions = { width, height, top, left }
       } else {
         this.$emit('size-changed', { width: 0, height: 0, top: 0, left: 0 })
       }