Skip to content

Conversation

@Sanchit2662
Copy link

@Sanchit2662 Sanchit2662 commented Jan 18, 2026

Summary

This PR fixes a memory leak caused by uncleaned scroll event listeners in the Layer5 website.
Both the Navigation and Brand sections were registering scroll listeners on mount without removing them on unmount. Since these components are re-mounted on every client-side navigation in Gatsby, this resulted in accumulating event listeners, leading to degraded performance over time.

The fix ensures that scroll listeners are properly cleaned up, use a stable function reference, and are marked as passive for better scroll performance.


Problem Description

Before this change, the components attached a scroll listener like this:

useEffect(() => {
  window.addEventListener("scroll", () =>
    window.scrollY > 50 ? setScroll(true) : setScroll(false)
  );
}, []);

What goes wrong:

  • The listener is an anonymous function, so it cannot be removed
  • No cleanup function is returned from useEffect
  • In Gatsby, layouts and sections are unmounted and remounted on every page navigation
  • Each navigation adds a new scroll listener to window
  • Over time, multiple listeners fire on every scroll, each updating state

This causes unbounded memory growth and increasing CPU usage during normal browsing sessions.


Impact

Before

  • Scroll listeners accumulate with navigation
  • CPU work grows linearly on every scroll
  • Memory usage increases due to retained closures
  • Possible React warnings from state updates on unmounted components

After

  • Single scroll listener at all times
  • Stable memory usage
  • Consistent scroll performance
  • Safe long-running browsing sessions

This improves performance for all users, especially those browsing docs or community pages extensively.


Checklist

  • Yes, I signed my commits

Signed-off-by: Sanchit2662 <sanchit2662@gmail.com>
@Sanchit2662
Copy link
Author

Hi @kishore08-07 @leecalcote @Rajesh-Nagarajan-11,
This PR fixes a memory leak caused by uncleaned scroll event listeners accumulating on page navigation
Would appreciate your time to review when convenient. Thank you!

@CodexRaunak
Copy link
Contributor

@Sanchit2662 Thank you for your contribution! Let's discuss this during the website call tomorrow at 6:30 PM IST | 7 AM CST Add it as an agenda item to the meeting minutes, if you would 🙂

@l5io
Copy link
Contributor

l5io commented Jan 19, 2026

🚀 Preview for commit a15eb93 at: https://696e6be45027bd6c2ae1cdb0--layer5.netlify.app

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants