Évaluer la vitesse de connexion en javascript

Le 29/07/2013 à 04:57:13
Note: 4/5
Mots clés: évaluer vitesse connexion javascirpt visiteur script js estimer temps de chargement connaitre vitesse de téléchargement utilisateur en javascript ko/s bps octets par seconde

Bonjour,
dans ce script, je vais vous montrer comment détecter ou plutôt tester la vitesse de connexion de l'utilisateur grâce au langage de programmation Javascript.

Pour cela, nous allons évaluer le temps que vas prendre le navigateur pour charger une image, nous allons par la suite simplement faire une division taille de l'image/temps de chargement
nous obtiendrons donc la vitesse de connexion moyenne de l'utilisateur.

Voici l'image que nous allons utiliser pour ce script, elle aura le nom de image.png:

Elle a une taille de 158 298 octets.
Pour connaitre la taille d'une image, il suffit de faire un clic droit dessus et de cliquer sur Propriétés (dans Windows), la taille sera affichée parmi les informations de l'image.

Voici le script permettant d'évaluer la vitesse de connexion:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>Detecter vitesse de connexion</title>

        <script type="text/javascript">

        //<!--

            var image = 'http://www.supportduweb.com/ftp/ybouane/scripts_astuces/javascript/vitesse_connexion/image.png';

            var size = 158298;

            var time1 = 0;

            var time2 = 0;

            function start_test_vitesse()

            {

                time1 = new Date();

                time1 = time1.getTime();

                var img = new Image();

                img.src = image+'?'+time1;

                img.onload=end_test_vitesse;

            }

            function end_test_vitesse()

            {

                var time2 = new Date();

                time2 = time2.getTime();

                var ms = time2-time1;

                var vitesse = Math.round(size/ms*100)/100;

                document.getElementById('vitesse').value=vitesse+'ko/s';

            }

        //-->

        </script>

    </head>

    <body>

        Vitesse de connexion: <input type="text" id="vitesse" size="27" /><input type="button" value="Tester" onclick="javascript:start_test_vitesse();" />

    </body>

</html>

Essayer

Plus la taille de l'image est grande plus la vitesse de connexion sera exacte. Mais plus la taille de l'image est grande, plus de temps sera mis pour détecter la vitesse de connexion.

Le résultat de ce teste peut facilement être faussé si le serveur ou l'image est hébergée prend du temps à répondre.

merci, j'espère que vous avez aimé ce script et qu'il vous sera utile.

Scripts et Tutoriels similaires

Afficher l'heure et la date en temps réel

Se souvenir d'un visiteur Javascript - son nom et le nombre de visites script cookies

Système d'onglets en Javascript, (X)html et CSS dans la même page

Précharger des images en javascript et detecter la fin du prechargement

Compression Gzip en php - accélérer le téléchargement réduire taille pages