Skip to main content

useNetworkSpeed()

Tracks the device's network speed and connection type using the Network Information API. Ideal for optimizing content delivery or displaying network status in web apps.

Import​

import { useNetworkSpeed } from "reactuals";

Demo​

Loading...

Usage​

import { useNetworkSpeed } from "reactuals";

function NetworkSpeed() {
  const { effectiveType, downlinkMbps } = useNetworkSpeed();

  return (
   <div>
        <strong>Connection Type:</strong>{" "}
        {effectiveType ? effectiveType : "Unavailable"}
      </div>
      <div>
        <strong>Download Speed:</strong>{" "}
        {downlinkMbps !== null ? `${downlinkMbps} Mbps` : "Unavailable"}
      </div>
  );
}