DEV Community

Cover image for How to get the connection type of a user's device using JavaScript?
MELVIN GEORGE
MELVIN GEORGE

Posted on • Originally published at melvingeorge.me

How to get the connection type of a user's device using JavaScript?

Originally posted here!

This is an experimental technology still in Draft, so it may not work in all browsers.

To get the connection type of a user's device, you can use the effectiveType property in the navigator.connection object in JavaScript.

// get the connection type
const connectionType = navigator.connection.effectiveType;

console.log(connectionType); // 4g
Enter fullscreen mode Exit fullscreen mode

For better usability, it's better to check whether the Network API is available in the appropriate browsers by first checking for the appropriate connection object in the navigator object.

// check if connection object present
const connection =
  navigator.connection || navigator.mozConnection || navigator.webkitConnection;

// then use the effectiveType property
// to get the connection type
console.log(connection.effectiveType);
Enter fullscreen mode Exit fullscreen mode
  • This API can be used to determine whether to load high bandwidth data or low bandwidth data by first checking the user's connection type is slow or fast and thus making the application much faster in accessing the content.

See this example in JSBin.

Feel free to share if you found this useful 😃.


Top comments (0)