useNetwork

v0.0.14testeddemo

Reactive Network Information API state plus online/offline status.

Example

const { isOnline, offlineAt, downlink, effectiveType, saveData, type } = useNetwork();

Loading demo…

export function useNetwork(options: UseNetworkOptions ={ ... }

Parameter	Type	Default	Description
`options`?	`UseNetworkOptions`	`{}`	Options

UseNetworkReturnReactive online status, transition timestamps, and connection info

Property	Type	Default	Description
`isSupported`	`Readonly<ShallowRef<boolean>>`	—	Whether the Network Information API (`navigator.connection`) is supported.
`isOnline`	`Readonly<ShallowRef<boolean>>`	—	Whether the browser is currently online (`navigator.onLine`).
`offlineAt`	`Readonly<ShallowRef<number \| undefined>>`	—	The timestamp of the last time the browser went offline, in ms.
`onlineAt`	`Readonly<ShallowRef<number \| undefined>>`	—	The timestamp of the last time the browser came back online, in ms.
`downlink`	`Readonly<ShallowRef<number \| undefined>>`	—	The estimated effective bandwidth in megabits per second.
`downlinkMax`	`Readonly<ShallowRef<number \| undefined>>`	—	The maximum downlink speed of the underlying connection technology, in Mbps.
`effectiveType`	`Readonly<ShallowRef<NetworkEffectiveType>>`	—	The effective type of the connection (`slow-2g`, `2g`, `3g`, or `4g`).
`rtt`	`Readonly<ShallowRef<number \| undefined>>`	—	The estimated effective round-trip time of the current connection, in ms.
`saveData`	`Readonly<ShallowRef<boolean \| undefined>>`	—	Whether the user has requested a reduced data usage mode.
`type`	`Readonly<ShallowRef<NetworkType>>`	—	The type of connection a device is using to communicate with the network.