Para detectar la velocidad de la red usando javascript, usaremos el siguiente enfoque.
Enfoque: Abra la página web para la que desea conocer la velocidad de conexión. La página debe ser aquella para la que desea agregar el código javascript para detectar la velocidad. Asigne o configure la dirección de la imagen que desea usar para la prueba de velocidad a la variable. Deben crearse las variables para almacenar la hora de inicio, la hora de finalización y el tamaño de descarga de la prueba. Establezca el «tamaño de descarga» equivalente al tamaño del archivo de imagen (en bytes). El final de la acción de descarga se asigna para activarse cuando se completa la descarga de la imagen. Calcula la velocidad del proceso de descarga y la convierte a «kbps» y «mbps».
A continuación se muestra un ejemplo que ilustra el enfoque anterior:
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>
To detect network speed using JavaScript
</title>
</head>
<body>
<script type="text/javascript">
var userImageLink =
"https://media.geeksforgeeks.org/wp-content/cdn-uploads/20200714180638/CIP_Launch-banner.png";
var time_start, end_time;
// The size in bytes
var downloadSize = 5616998;
var downloadImgSrc = new Image();
downloadImgSrc.onload = function () {
end_time = new Date().getTime();
displaySpeed();
};
time_start = new Date().getTime();
downloadImgSrc.src = userImageLink;
document.write("time start: " + time_start);
document.write("<br>");
function displaySpeed() {
var timeDuration = (end_time - time_start) / 1000;
var loadedBits = downloadSize * 8;
/* Converts a number into string
using toFixed(2) rounding to 2 */
var bps = (loadedBits / timeDuration).toFixed(2);
var speedInKbps = (bps / 1024).toFixed(2);
var speedInMbps = (speedInKbps / 1024).toFixed(2);
alert("Your internet connection speed is: \n"
+ bps + " bps\n" + speedInKbps
+ " kbps\n" + speedInMbps + " Mbps\n");
}
</script>
</body>
</html>
Producción:
Publicación traducida automáticamente
Artículo escrito por romy421kumari y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA