Maison > interface Web > js tutoriel > Comment puis-je estimer la vitesse d'Internet à l'aide de JavaScript ?

Comment puis-je estimer la vitesse d'Internet à l'aide de JavaScript ?

Barbara Streisand
Libérer: 2024-12-15 20:41:10
original
196 Les gens l'ont consulté

How Can I Estimate Internet Speed Using JavaScript?

Comment estimer la vitesse d'Internet en JavaScript

Question : Comment puis-je créer une page JavaScript qui estime la vitesse de l'utilisateur vitesse Internet et l'affiche sur le page ?

Réponse :

Il est difficile de mesurer avec précision la vitesse d'Internet dans le navigateur en raison de facteurs indépendants de la volonté de l'application Web. Cependant, une estimation approximative peut être obtenue en :

  1. Chargement d'une image avec une taille connue : Chargez une image avec une taille de fichier connue importante, par exemple plusieurs mégaoctets.
  2. Mesurer le temps de chargement : Suivez le temps nécessaire au chargement de l'image (par exemple, en utilisant l'outil onload écouteur d'événement).
  3. Estimation de la vitesse : Calculez la vitesse Internet estimée en divisant la taille du fichier image par le temps de chargement mesuré.

Exemple :

Le code JavaScript suivant démontre le processus :

// Image address and file size (in bytes)
var imageAddr = "https://large-image-url";
var downloadSize = 7300000;

// Function to show progress messages
function ShowProgressMessage(msg) {
  // Display messages in the console and a UI element
}

// Function to initiate speed detection
function InitiateSpeedDetection() {
  ShowProgressMessage("Loading image...");
  window.setTimeout(MeasureConnectionSpeed, 1);
}

if (window.addEventListener) {
  window.addEventListener('load', InitiateSpeedDetection, false);
} else if (window.attachEvent) {
  window.attachEvent('onload', InitiateSpeedDetection);
}

// Function to measure connection speed
function MeasureConnectionSpeed() {
  var startTime, endTime;
  var download = new Image();

  // Event listeners for load and error
  download.onload = showResults;
  download.onerror = function (err, msg) {
    ShowProgressMessage("Invalid image or error downloading");
  };

  startTime = (new Date()).getTime();
  var cacheBuster = "?nnn=" + startTime;
  download.src = imageAddr + cacheBuster;

  // Function to show speed results
  function showResults() {
    endTime = (new Date()).getTime();
    var duration = (endTime - startTime) / 1000;
    var bitsLoaded = downloadSize * 8;
    var speedBps = (bitsLoaded / duration).toFixed(2);
    var speedKbps = (speedBps / 1024).toFixed(2);
    var speedMbps = (speedKbps / 1024).toFixed(2);

    ShowProgressMessage([
      "Your connection speed is:",
      speedBps + " bps",
      speedKbps + " kbps",
      speedMbps + " Mbps"
    ]);
  }
}
Copier après la connexion

Remarque :

  • La vitesse estimée est probablement inférieure à votre vitesse réelle en raison de la mise en cache du navigateur et d'autres facteurs.
  • Cette méthode est uniquement à des fins de démonstration et ne doit pas être utilisée pour des mesures de vitesse fiables.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal