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
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);
- 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.