Hoe je eigen speedtest implementeren met pure JavaScript zonder externe services

Heb je ooit meegemaakt dat je abonnement gigabit-internet belooft, bestanden snel downloaden, maar je werkgesprek of toegang tot je thuisserver pijnlijk traag is? Je eerste reactie is om een bekende speedtest-site te openen en op de grote ronde knop te drukken. Het probleem is dat publieke tests de snelheid naar de servers van de provider meten, niet de werkelijke doorvoer binnen je lokale netwerk, kantooromgeving of persoonlijke cloud.

Ik stuitte op de Speed-Test repository van het OpenSpeedTest-project. De auteur ontwikkelt het al meer dan tien jaar, sinds 2011. Het is een open-source netwerkbandbreedte-testtool volledig geschreven in pure HTML5, CSS en Vanilla JavaScript. Geen React, Vue, zware bundles of externe afhankelijkheden.

Wat zit er onder de motorkap

Het hoogtepunt van de broncode is de elegantie. Alle client-side logica is gecomprimeerd in een gecomprimeerd script van minder dan 8 KB. De interface wordt volledig weergegeven in vector SVG, dus het ziet er even scherp uit op een oude monitor als op een 4K-smartphone.

Om de tool te laten werken, heeft de client-side alleen een browser nodig die XMLHttpRequest (XHR2) ondersteunt. Zelfs de oude Internet Explorer 10 volstaat. Aan de server-side is het voldoende om statische bestanden te serveren via elke willekeurige webserver: Nginx, Apache, Caddy of Express.

Er zijn geen verborgen backend-scripts of complexe binaries, dus het aanvalsoppervlak is minimaal. In wezen serveer je de browser een set statische bestanden, waarna de client een reeks parallelle POST- en GET-verzoeken van een opgegeven grootte begint te sturen.

Tests beheren via URL-parameters

In plaats van omslachtige instellingenmenu's te bouwen, heeft de auteur de besturing via GET-parameters in de adresbalk geïmplementeerd. Dit is handig als je collega's een kant-en-klare link met vooraf geconfigureerd gedrag wilt geven.

Hier zijn enkele nuttige parameters:

• Test automatisch starten zodra de pagina opent:

http://192.168.1.5?Run

• Netwerk belasten. Je kunt een voorinstelling instellen of de testduur in seconden opgeven. Voer bijvoorbeeld verkeer 300 seconden in beide richtingen uit:

http://192.168.1.5?Stress=300

Of een kortere syntaxis:

http://192.168.1.5?S=L

• Beperk het aantal parallelle HTTP-streams (standaard is 6, maximum is 32):

http://192.168.1.5?XHR=4

• Voer een specifieke fase uit, bijvoorbeeld alleen upload of latentiecontrole:

http://192.168.1.5?Test=Upload

Als je statistieken wilt verzamelen van een fleet van kantoormachines, kun je in het index.html bestand de saveData variabelen uncommenten en je database-webhookadres opgeven:

var saveData = true;
var saveDataURL = "//metrics.internal.lan/save?data=";

Hoe je het zelf kunt draaien

De snelste manier om je eigen speedtest te implementeren is een kant-en-klare Docker-image. Het is gebouwd op lichtgewicht Alpine met een non-root Nginx-gebruiker:

docker run -d \
  --name openspeedtest \
  --restart=unless-stopped \
  -p 3000:3000 \
  -p 3001:3001 \
  openspeedtest/latest

Als je liever met compose werkt, ziet de configuratie er compact uit:

version: '3.3'
services:
  speedtest:
    container_name: openspeedtest
    image: openspeedtest/latest
    restart: unless-stopped
    ports:
      - '3000:3000'
      - '3001:3001'

Na het opstarten is de interface beschikbaar op http://IP_СЕРВЕРА:3000.

Als je de service achter je eigen reverse proxy installeert, zorg er dan voor dat de limiet voor de request body size client_max_body_size verhoogt naar minimaal 35 MB. Anders gaan upload-tests mislukken met een 413-fout.

Trouwens, als je van plan bent snelheden boven 1 Gbps te testen, raadt de auteur aan om een Linux-host te gebruiken. Op Docker Desktop voor macOS of Windows haalt de snelheid vaak het plafond door virtualisatie- en netwerkbridge-overhead.

Waarom een lokale speedtest houden

Er zijn verschillende scenario's waarin reguliere webservices nutteloos zijn:

1. Wi-Fi en repeaters diagnosticeren. Wanneer je een signaalrepeater thuis of op kantoor installeert, daalt de snelheid gemiddeld genomen met de helft. De verbinding lokaal testen vanuit verschillende kamers stelt je in staat om precies de beste plek voor een access point te kiezen zonder beïnvloed te worden door schommelingen in je externe internetverbinding.
2. De impact van browserextensies controleren. Soms tonen tools zoals iperf een eerlijke gigabit, maar openen webpagina's langzaam. Voer OpenSpeedTest uit in je normale profiel en vervolgens in een privévenster. Het verschil in resultaten toont hoeveel milliseconden je geïnstalleerde plugins opslokken.
3. Kanalen naar een extern kantoor evalueren. Wanneer remote workers klagen over trage toegang tot bestandsopslag, toont een lokale container op de server de werkelijke tunnelsnelheid.

Is het de moeite waard om te proberen

Speed-Test lost één specifiek probleem op zonder advertenties, externe telemetry of uitgebreide afhankelijkheden. Als je regelmatig lokale netwerken moet configureren, defecte patchkabels moet opsporen of de prestaties van een thuis-NAS moet controleren, houd deze image dan stand-by. Het implementeert in een minuut, verbruikt minimale resources en biedt enorme waarde.