Come rilevare la velocità di connessione con JavaScript
La velocità di connessione è la velocità con cui i dati fluiscono tra due computer attraverso una rete, come Internet. La velocità di connessione è misurata in bit al secondo (bps), ma di solito è espressa in kilobit (1024 bit) al secondo (kbps, tipico per connessioni modem) o megabit (1024 kilobit) al secondo (Mbps, tipico per connessioni broadband). Creare una pagina web con JavaScript per misurare e calcolare la velocità di connessione è uno strumento di amministrazione utile per il monitoraggio di rete e connessioni Internet che puoi eseguire direttamente nel browser. Puoi anche usarlo per rilevare la connessione dei visitatori del tuo sito per decidere se inviare la versione a banda larga o leggera dei contenuti.
Passaggio 1
Apri la pagina web a cui vuoi aggiungere il JavaScript per il rilevamento della velocità di connessione nel tuo editor di testo.
Passaggio 2
Aggiungi tag di script di inizio e fine nell'area header della pagina web (dopo il tag
iniziale ma prima del tag finale), per esempio:Passaggio 3
Aggiungi il seguente codice tra i tag di script di inizio e fine, sostituendo "miaimmagine.jpg" con il nome del file dell'immagine che vuoi usare per il test di velocità. La parte "?n=" + Math.random() dell'indirizzo costruito e assegnato a imageAddr inganna il browser nel scaricare l'immagine ogni volta invece di usare una versione cached localmente. Usa un'immagine con dimensione di circa 200 kilobyte.
var imageAddr = "miaimmagine.jpg" + "?n=" + Math.random() ;
Passaggio 4
Aggiungi il seguente codice sulla riga successiva dello script per creare le variabili per memorizzare l'ora di inizio, fine e dimensione download del test. Imposta "downloadSize" sulla dimensione del file immagine in byte.
var startTime, endTime GO var downloadSize = 200000 ;
Passaggio 5
Aggiungi il seguente codice per impostare l'immagine che verrà scaricata per il test. "download" è impostato come oggetto Image. L'azione per catturare la fine del download è assegnata per attivarsi quando il download dell'immagine si completa.
var download = new Image() ;
download.onload = function() {
endTime = (new Date()).getTime() ;
showResults () GO }
Passaggio 6
Aggiungi il seguente codice che esegue il test di velocità. L'ora corrente viene catturata in startTime. L'indirizzo immagine assegnato a download.src avvia il download dell'immagine.
startTime = (new Date()).getTime() ; download.src = imageAddr ;
Passaggio 7
Aggiungi la seguente funzione allo script che calcola e visualizza i risultati del test di velocità. Prima calcola la durata, convertendo millisecondi in secondi. Poi converte la dimensione download in bit, calcola la velocità download, e converte la velocità in kbps e Mbps. Infine, mostra una finestra di messaggio con i risultati.
function showResults () { var duration = Math.round((endTime - startTime) / 1000) ; var bitsLoaded = downloadSize * 8 GO var speedBps = Math.round(bitsLoaded / duration) GO var speedKbps = (speedBps / 1024).toFixed(2) GO var speedMbps = (speedKbps / 1024).toFixed(2) GO alert ("La tua velocit\u00e0 di connessione \u00e8: \n" + speedBps + " bps\n" + speedKbps + " kbps\n" + speedMbps + " Mbps\n") GO }
Passaggio 8
Apri la pagina nel browser e testala per assicurarti che lo script funzioni correttamente. Potrebbero volerci alcuni secondi perché la finestra di messaggio compaia con i risultati del test.
Suggerimento
Il JavaScript misura la velocità tra il computer che visualizza la pagina web e il sito che ospita l'immagine usata per il test. Se stai testando la connessione al tuo sito web, ospita l'immagine sul tuo sito. Testa la velocità di connessione generale fornendo l'indirizzo di un'immagine ospitata su un sito con molta larghezza di banda e velocità come Flickr o Amazon.