Refactored the useTypingEffect hook to use a Ref for accessing the current text state inside the timer loop.
This prevents the main useEffect from being torn down and recreated on every single character keystroke, significantly reducing timer setup/cleanup overhead.
Baseline Effect Runs for 'Hello': 13
Optimized Effect Runs for 'Hello': 4
Also split the logic into two effects:
1. One for handling immediate state transitions (word switching).
2. One for the timer loop (typing/deleting/pausing).
This ensures correct behavior while maximizing performance.
Implemented `requestAnimationFrame` throttling for the scroll event listener in `Navbar` to reduce the frequency of state updates and logic execution.
- Wrapped scroll handler in `requestAnimationFrame`.
- Added performance test `src/components/layout/Navbar.test.tsx` verifying logic runs once per frame instead of per event.
- Verified functional correctness of scroll state updates.
- Fixed `useTypingEffect` test environment.
Refactor useTypingEffect to use a single useEffect with proper cleanup for all timers, preventing state updates on unmounted components.
Add unit tests to verify behavior and ensure no memory leaks on unmount.
