From 55bb7cb5c679c704c692f261dcfc7b7b1737bce3 Mon Sep 17 00:00:00 2001
From: Lin Junrong <noron12334@gmail.com>
Date: Fri, 31 Jul 2026 17:44:34 +0800
Subject: [PATCH] fix(GlassSurface): drop the duplicated resize effect
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The component registers the same effect twice — byte-identical bodies, both
creating a ResizeObserver on containerRef and calling updateDisplacementMap.
So every instance runs two observers on one element and rebuilds the SVG
displacement map twice on every resize.

Removes the second copy. All four variants carry the same duplication.
---
 .../Components/GlassSurface/GlassSurface.jsx       | 14 --------------
 .../Components/GlassSurface/GlassSurface.jsx       | 14 --------------
 .../Components/GlassSurface/GlassSurface.tsx       | 14 --------------
 .../Components/GlassSurface/GlassSurface.tsx       | 14 --------------
 4 files changed, 56 deletions(-)

diff --git a/src/content/Components/GlassSurface/GlassSurface.jsx b/src/content/Components/GlassSurface/GlassSurface.jsx
index 304c157ad..03f020a4c 100644
--- a/src/content/Components/GlassSurface/GlassSurface.jsx
+++ b/src/content/Components/GlassSurface/GlassSurface.jsx
@@ -117,20 +117,6 @@ const GlassSurface = ({
     };
   }, []);
 
-  useEffect(() => {
-    if (!containerRef.current) return;
-
-    const resizeObserver = new ResizeObserver(() => {
-      setTimeout(updateDisplacementMap, 0);
-    });
-
-    resizeObserver.observe(containerRef.current);
-
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, []);
-
   useEffect(() => {
     setTimeout(updateDisplacementMap, 0);
   }, [width, height]);
diff --git a/src/tailwind/Components/GlassSurface/GlassSurface.jsx b/src/tailwind/Components/GlassSurface/GlassSurface.jsx
index 48e0d9462..f5435f92a 100644
--- a/src/tailwind/Components/GlassSurface/GlassSurface.jsx
+++ b/src/tailwind/Components/GlassSurface/GlassSurface.jsx
@@ -135,20 +135,6 @@ const GlassSurface = ({
     };
   }, []);
 
-  useEffect(() => {
-    if (!containerRef.current) return;
-
-    const resizeObserver = new ResizeObserver(() => {
-      setTimeout(updateDisplacementMap, 0);
-    });
-
-    resizeObserver.observe(containerRef.current);
-
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, []);
-
   useEffect(() => {
     setTimeout(updateDisplacementMap, 0);
   }, [width, height]);
diff --git a/src/ts-default/Components/GlassSurface/GlassSurface.tsx b/src/ts-default/Components/GlassSurface/GlassSurface.tsx
index 795f6bba5..1c14166dc 100644
--- a/src/ts-default/Components/GlassSurface/GlassSurface.tsx
+++ b/src/ts-default/Components/GlassSurface/GlassSurface.tsx
@@ -157,20 +157,6 @@ const GlassSurface: React.FC<GlassSurfaceProps> = ({
     };
   }, []);
 
-  useEffect(() => {
-    if (!containerRef.current) return;
-
-    const resizeObserver = new ResizeObserver(() => {
-      setTimeout(updateDisplacementMap, 0);
-    });
-
-    resizeObserver.observe(containerRef.current);
-
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, []);
-
   useEffect(() => {
     setTimeout(updateDisplacementMap, 0);
   }, [width, height]);
diff --git a/src/ts-tailwind/Components/GlassSurface/GlassSurface.tsx b/src/ts-tailwind/Components/GlassSurface/GlassSurface.tsx
index 4c7f3848f..93458101c 100644
--- a/src/ts-tailwind/Components/GlassSurface/GlassSurface.tsx
+++ b/src/ts-tailwind/Components/GlassSurface/GlassSurface.tsx
@@ -179,20 +179,6 @@ const GlassSurface: React.FC<GlassSurfaceProps> = ({
     };
   }, []);
 
-  useEffect(() => {
-    if (!containerRef.current) return;
-
-    const resizeObserver = new ResizeObserver(() => {
-      setTimeout(updateDisplacementMap, 0);
-    });
-
-    resizeObserver.observe(containerRef.current);
-
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, []);
-
   useEffect(() => {
     setTimeout(updateDisplacementMap, 0);
   }, [width, height]);