스스로 위치를 정하는 Native Popover
(dev.to)
Popover API와 CSS Anchor Positioning은 복잡한 UI를 별도 라이브러리 없이 네이티브로 구현하게 함으로써, 프론트엔드 개발의 코드 복잡성을 줄이고 웹 성능을 극대화하는 패러다임의 전환을 예고하고 있습니다.
이 글의 핵심 포인트
- 1Popover API는 2025년 4월부터 모든 브라우저에 안정화되어, 버튼 클릭 시 툴팁/팝오버를 네이티브로 구현한다.
- 2기존에는 35KB의 Floating UI 등 대규모 JS 라이브러리가 필요했지만, Popover API는 JavaScript 없이 네이티브 기능을 제공한다.
- 3Popover API는 z-index 관리, 외부 클릭 닫기(light dismiss), ESC 키보드 처리, 포커스 관리 등 복잡한 기능을 기본 제공한다.