From fe6e07fe922f9c07f43d15dadf89387d39a0e8cf Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Fri, 23 Jan 2026 09:29:42 +0000
Subject: [PATCH] perf: pause GradientBlinds animation when off-screen

Removes the unconditional start of the animation loop on mount. The loop is now exclusively managed by the existing IntersectionObserver, ensuring it only runs when the component is visible.

Updates tests to reflect this behavior by simulating intersection events to trigger the animation.
---
 .../effects/GradientBlinds.test.tsx           | 21 +++++++++++++++++--
 src/components/effects/GradientBlinds.tsx     |  2 --
 2 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/components/effects/GradientBlinds.test.tsx b/src/components/effects/GradientBlinds.test.tsx
index 4a2789c..e29a176 100644
--- a/src/components/effects/GradientBlinds.test.tsx
+++ b/src/components/effects/GradientBlinds.test.tsx
@@ -66,8 +66,17 @@ describe('GradientBlinds', () => {
     vi.clearAllMocks();
   });
 
-  it('starts animation loop on mount', () => {
+  it('does not start animation loop on mount until visible', () => {
     const { unmount } = render(<GradientBlinds />);
+    expect(rafSpy).not.toHaveBeenCalled();
+
+    // Simulate on-screen
+    act(() => {
+      if (ioCallback) {
+        ioCallback([{ isIntersecting: true } as IntersectionObserverEntry]);
+      }
+    });
+
     expect(rafSpy).toHaveBeenCalled();
     unmount();
     expect(cancelRafSpy).toHaveBeenCalled();
@@ -76,7 +85,15 @@ describe('GradientBlinds', () => {
   it('pauses animation loop when off-screen and resumes when on-screen', () => {
     const { unmount } = render(<GradientBlinds />);
 
-    // Initial start
+    // Should not start initially
+    expect(rafSpy).not.toHaveBeenCalled();
+
+    // Simulate on-screen (start)
+    act(() => {
+      if (ioCallback) {
+        ioCallback([{ isIntersecting: true } as IntersectionObserverEntry]);
+      }
+    });
     expect(rafSpy).toHaveBeenCalledTimes(1);
 
     // Reset spies to check for subsequent calls
diff --git a/src/components/effects/GradientBlinds.tsx b/src/components/effects/GradientBlinds.tsx
index 735c48e..7a1595e 100644
--- a/src/components/effects/GradientBlinds.tsx
+++ b/src/components/effects/GradientBlinds.tsx
@@ -349,8 +349,6 @@ void main() {
     });
     observer.observe(container);
 
-    rafRef.current = requestAnimationFrame(loop);
-
     return () => {
       if (rafRef.current) cancelAnimationFrame(rafRef.current);
       canvas.removeEventListener('pointermove', onPointerMove);