Don't touch needless peroperties for better performance #3557

piroor · May 23, 2024 · 9022cb0 · 9022cb0
1 parent 0abe3e2
commit 9022cb0
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 5 deletions.
diff --git a/webextensions/common/common.js b/webextensions/common/common.js
@@ -985,10 +985,16 @@ export async function doProgressively(tabs, task, interval) {
 }
 
 
-export function watchOverflowStateChange({ target, moreResizeTargets, onOverflow, onUnderflow }) {
+export function watchOverflowStateChange({ target, moreResizeTargets, onOverflow, onUnderflow, horizontal, vertical }) {
+  if (!horizontal && !vertical)
+    return;
+
   onOverflow  = onOverflow  || (() => {});
   onUnderflow = onUnderflow || (() => {});
-  let lastOverflow = isOverflow(target);
+  let lastOverflow = (
+    (horizontal && isOverflowHorizontally(target)) ||
+    (vertical && isOverflowVertically(target))
+  );
   let lastStarted = new Map();
   const onObserved = () => {
     const startAt = `${Date.now()}-${parseInt(Math.random() * 65000)}`;
@@ -997,7 +1003,10 @@ export function watchOverflowStateChange({ target, moreResizeTargets, onOverflow
       if (lastStarted.get(target) != startAt)
         return;
 
-      const overflow = isOverflow(target);
+      const overflow = (
+        (horizontal && isOverflowHorizontally(target)) ||
+        (vertical && isOverflowVertically(target))
+      );
       if (overflow == lastOverflow)
         return;
 
@@ -1053,8 +1062,12 @@ export function watchOverflowStateChange({ target, moreResizeTargets, onOverflow
   return unwatch;
 }
 
-function isOverflow(target) {
-  return target.scrollHeight > target.clientHeight || target.scrollWidth > target.clientWidth;
+function isOverflowHorizontally(target) {
+  return target.scrollWidth > target.clientWidth;
+}
+
+function isOverflowVertically(target) {
+  return target.scrollHeight > target.clientHeight;
 }
 
 

diff --git a/webextensions/sidebar/components/TabLabelElement.js b/webextensions/sidebar/components/TabLabelElement.js
@@ -175,6 +175,7 @@ export class TabLabelElement extends HTMLElement {
     this.__onUnderflow = this._onUnderflow.bind(this);
     this.__unwatch     = watchOverflowStateChange({
       target:      this,
+      horizontal:  true,
       onOverflow:  () => this.__onOverflow(),
       onUnderflow: () => this.__onUnderflow(),
     });

diff --git a/webextensions/sidebar/scroll.js b/webextensions/sidebar/scroll.js
@@ -141,6 +141,7 @@ export function init(scrollPosition) {
 function startObserveOverflowStateChange() {
   watchOverflowStateChange({
     target: mNormalScrollBox,
+    vertical: true,
     moreResizeTargets: [
       // We need to watch resizing of the virtual scroll container to detect the changed state correctly.
       mNormalScrollBox.querySelector('.virtual-scroll-container'),