So, at a basic level, when you connect, it downloads the web page over HTTPS, the site and the server then establish a WebSockets connection, and then the site and the server uses an external STUN server to negotiate a WebRTC connection. The site then establishes an unreliable data channel using WebRTC and sends a bunch of packets to the server, which records them and then sends them right back. The client then records the ping times and which ones it got back. The server also sends a log over WebSockets of which packets made it up, so that you can tell upload packet loss versus download packet loss.
So, as for the specific technologies and services used:
- The domain name was registered at NameSilo.
- The SSL certificate is provided by Let's Encrypt.
- The static HTTPS website is hosted on Netlify, which pulls from GitHub.
- The WebSocket and WebRTC server is hosted with Linode.
- This WebSocket and WebRTC server runs Node.js as the server software.
- I use Google's free public STUN server (stun.l.google.com:19302) to make the ICE connection.
- Chart.js renders the bar chart at the bottom of the results.
- Also, for translation, I largely (But not entirely!) used Google Translate. >.>
Also, DeepL and Linguee were amazing helps that I wholly recommend.