useNetwork

A React Hook that tracks network status.

Demo

Source
Is online:
true
Effective type:
undefined
RTT:
undefined
Downlink:
undefined

Usage

See API for more details.

Source

Click links below to view source on GitHub.

API

const network = useNetwork()

Returns

export type UseNetworkReturns = {
  /**
   * Whether the browser supports the Network Information API.
   */
  isSupported: boolean
  /**
   * Whether the user is currently connected.
   */
  isOnline: boolean
  /**
   * The time since the user was last connected.
   */
  offlineAt: number | undefined
  /**
   * At this time, if the user is offline and reconnects.
   */
  onlineAt: number | undefined
  /**
   * download speed in Mbps.
   */
  downlink: number | undefined
  /**
   * The max reachable download speed in Mbps.
   */
  downlinkMax: number | undefined
  /**
   * The detected effective speed type.
   */
  effectiveType: NetworkEffectiveType | undefined
  /**
   * The estimated effective round-trip time of the current connection.
   */
  rtt: number | undefined
  /**
   * If the user activated data saver mode.
   */
  saveData: boolean | undefined
  /**
   * The detected connection/network type.
   */
  type: NetworkType
}