useNetwork

A hook that tracks the state of network connection.

Examples

Default usage

Network information:
{
  "online": true,
  "rtt": 0,
  "saveData": false,
  "downlink": 10,
  "effectiveType": "4g"
}

Basic usage

Return network status

API

interface NetworkState {  online?: boolean;  since?: Date;  rtt?: number;  type?: string;  downlink?: number;  saveData?: boolean;  downlinkMax?: number;  effectiveType?: string;}const result: NetworkState = useNetwork();
interface NetworkState {  online?: boolean;  since?: Date;  rtt?: number;  type?: string;  downlink?: number;  saveData?: boolean;  downlinkMax?: number;  effectiveType?: string;}const result: NetworkState = useNetwork();

Result

PropertyDescriptionType
onlineWhether connected to networkboolean
sinceonline latest update timeDate
rttThe effective round-trip time estimate in millisecondsnumber
typeThe connection type that the user agent is usingbluetooth | cellular | ethernet | none | wifi | wimax | other | unknown
downlinkThe effective bandwidth estimate in megabits per second,number
downlinkMaxAn upper bound on the downlink speed of the first network hopnumber
saveDataWhether the user agent has set the option to reduce data usageboolean
effectiveTypeThe effective connection typeslow-2g | 2g | 3g | 4g

More information refer to MDN NetworkInformation