This is an experimental technology still in Draft, so it may not work in all browsers.
To check whether the user has turned on the option to reduce data usage on the user's device, you can use the saveData
property in the navigator.connection
object in JavaScript.
// Check whether user turned on the option
// to reduce data usage
const isDataSaverTurnedOn = navigator.connection.saveData;
console.log(isDataSaveTurnedOn); // false
-
The
saveData
property returns a booleanfalse
if it is turned off andtrue
if it is turned on. -
This API can be used to switch to use the low-quality content thus saving the user's data usage.
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 check whether the user turned on the option
// to reduce data usage
console.log(connection.saveData);
See this example in JSBin.