React에서 스크롤 기반 헤더 최적화하기 스크롤 기반의 동작은 웹 애플리케이션에서 흔히 볼 수 있는 패턴입니다. 이런 패턴은 사용자 경험(UX)을 크게 향상시켜주지만, 잘못 구현될 경우 성능에 문제를 가져올 수 있습니다. 이 글에서는 React Hook을 사용하여 스크롤에 따라 헤더 내용을 바꾸는 작업의 최적화 과정을 함께 살펴보겠습니다. 초기 구현: 이전 코드 우리가 개선 전에 사용하던 코드는 아래와 같습니다: import { useEffect } from "react"; import { Store } from "Helper"; import { CommonHeaderTypePageActions } from "Action"; const useProminentHeader = (ref, title) => ..
