react-visibility-hooks

Zero-dependency React hooks for visibility, idle detection, smart polling, battery, wake lock, and more. Tree-shakeable, SSR-safe, TypeScript-first.

Why react-visibility-hooks?

Zero Dependencies

No runtime dependencies. Ship less JavaScript to your users.

SSR-Safe

Works with Next.js (App & Pages Router), Remix, Gatsby, and all SSR frameworks out of the box.

Tree-Shakeable

Import only the hooks you need — unused hooks are automatically excluded from your bundle.

TypeScript-First

Fully typed with exported interfaces. Great autocomplete and compile-time safety.

Hook	Description
`useDocVisible`	Is the browser tab visible?
`useIdleVisibility`	Page visibility + user idle detection
`useAutoPauseVideo`	Auto-pause/resume `<video>` on tab visibility
`useSmartPolling`	Visibility-aware data polling with dedup
`usePageFocusEffect`	Callbacks on visibility transitions
`useNetworkAwarePolling`	Smart polling + network quality awareness
`useInactivityTimeout`	Session timeout with warning countdown
`useWakeLock`	Prevent screen dimming
`useBatteryAware`	React to device battery level and charging state

Start with useDocVisible when you only need to pause/resume work on tab hide/show.
Choose useSmartPolling for visibility-aware API polling with deduped updates.
Choose useNetworkAwarePolling when polling should adapt to offline and slow networks.
Use useInactivityTimeout for session timeout UX with warning countdowns.
Use useWakeLock to keep the screen awake during long-running user flows.
Use useBatteryAware to reduce work and preserve battery on low power.