From 51547318e18b2ecdf20dbcd3f8654c122b67ec38 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Fri, 30 Jan 2026 01:44:56 +0000
Subject: [PATCH] perf(navbar): optimize scroll handler to reduce state updates

- Introduces a local tracking variable in `Navbar` scroll effect to prevent redundant `setState` calls during scroll.
- Ensures the state is correctly initialized on mount if the page is already scrolled.
- Uses `requestAnimationFrame` for efficient scroll handling.

This reduces the number of React reconciliation cycles during scrolling, improving main thread performance.

Co-authored-by: ragusa-it <196988693+ragusa-it@users.noreply.github.com>
---
 src/components/layout/Navbar.tsx | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/components/layout/Navbar.tsx b/src/components/layout/Navbar.tsx
index 26f9350..bc21931 100644
--- a/src/components/layout/Navbar.tsx
+++ b/src/components/layout/Navbar.tsx
@@ -25,10 +25,22 @@ export function Navbar() {
 
   useEffect(() => {
     let ticking = false;
+    // Optimization: Track last state to avoid redundant setState calls
+    let prevIsScrolled = window.scrollY > 20;
+
+    // Set initial state correctly if page is loaded scrolled down
+    if (prevIsScrolled) {
+      setIsScrolled(true);
+    }
+
     const handleScroll = () => {
       if (!ticking) {
         window.requestAnimationFrame(() => {
-          setIsScrolled(window.scrollY > 20);
+          const currentIsScrolled = window.scrollY > 20;
+          if (currentIsScrolled !== prevIsScrolled) {
+            setIsScrolled(currentIsScrolled);
+            prevIsScrolled = currentIsScrolled;
+          }
           ticking = false;
         });
         ticking = true;