useNetworkState

React hook that tracks the network state of the user's browser with useNetworkState.

About

The useNetworkState React hook delivers real-time insights about the network status in your application, helping to adapt app behavior to varying connectivity conditions. It offers up-to-date snapshots of the network state, such as online/offline status, connection speed, and type. Through its use, you can respond effectively to network changes, fostering a seamless user experience even under unstable or varying connectivity. Please note, this hook is intended for client-side use only.

Props

• online: boolean - Indicates whether the browser is online or offline.
• downlink: number - The effective bandwidth estimate in megabits per second, rounded to the nearest multiple of 25 kilobits per seconds.
• downlinkMax: number - The maximum downlink speed, in megabits per second (Mbps), for the underlying connection technology.
• effectiveType: string - The effective type of the connection for general web browsing purposes (either ‘slow-2g’, ‘2g’, ‘3g’, or ‘4g’).
• rtt: number - The estimated round-trip latency of the connection, in milliseconds.
• saveData: boolean - Whether the user has requested a reduced data usage mode from the user agent.
• type: string - The type of connection a device is using to communicate with the network. It could be one of the following values: ‘bluetooth’, ‘cellular’, ‘ethernet’, ‘none’, ‘wifi’, ‘wimax’, ‘other’, ‘unknown’.

Installation

npx ever-ui-clx@0.2.1 add demo-use-network-state
# └──> Hook coming soon.

Usage