문제 상황

local 환경에서 FE 어플리케이션을 개발하다가 cursor: pointer;가 동작하지 않는 상황을 겪었다. 원인으로 추정되는 문제들을 정리했다.

1. GPU 가속(Renderer) 문제

브라우저는 커서 렌더링까지 GPU에 위임하는데, 오랫동안 켜둔 후 sleep/wake 반복, 외장 모니터 연결/해제, VRAM 부족 등이 발생하면 GPU 레이어가 죽거나 fallback 모드로 들어가면서 커서 변경이 먹지 않는 상황이 생긴다.

증상

• cursor: pointer 뿐 아니라 cursor: text, cursor: move도 적용이 안 됨

• 하이라이트, transition, animation 일부가 끊김

• DevTools Performance 패널에서 “software renderer”로 표시됨

해결

• 브라우저 재시작 → 거의 100% 해결

• chrome://flags → Hardware Acceleration on/off 전환

• OS 디스플레이 설정에서 외장 모니터 재연결

• GPU 드라이버 업데이트

2. 브라우저 Memory Leak → Pointer Event 가 먹통

특히 React 기반 무거운 페이지를 오래 열어두면 메모리 누수로 브라우저 전체가 fallback 상태가 될 수 있다.

증상

cursor:pointer가 안 먹고

hover, :active 같은 pseudo-class도 느리거나 적용 안 됨

스크롤, input 포커스 등이 버벅임

해결

• 탭 새로 열기

• DevTools ↔ 포커스 전환

• 브라우저 전체 재시작