This is a simplified client-side web speed test based on the LibreSpeed project. It allows users to measure their internet download, upload, ping, and jitter directly in their web browser.
Original Project & Author: This project is derived from LibreSpeed, originally created by Federico Dossena. You can find the original project on GitHub: https://github.com/librespeed/speedtest/
This simplified version focuses on core speed testing functionalities:
-
Download Speed Test: Measures your download bandwidth.
-
Upload Speed Test: Measures your upload bandwidth.
-
Ping Test: Determines the latency to the server.
-
Jitter Measurement: Calculates the variation in ping times.
-
Single Server Operation: Configured for a single test server, simplifying setup.
-
Clean UI: Minimal interface for a straightforward user experience.
To run this web speed test, you need a web server (like Apache, Nginx, or PHP's built-in server) that can serve PHP files.
-
A web server (e.g., Apache, Nginx, or a simple PHP development server).
-
PHP installed on your server (for
garbage.phpandempty.php).
Ensure your files are arranged as follows in your web server's document root (or a subdirectory):
your-speedtest-folder/
├── index.html
├── speedtest.js
├── speedtest_worker.js
├── garbage.php
└── empty.php
-
Place Files: Copy all the files (
index.html,speedtest.js,speedtest_worker.js,garbage.php,empty.php) into a directory on your web server. -
Configure PHP Files:
-
Ensure
garbage.phpandempty.phpare accessible by your web server and PHP interpreter. These files are crucial for the download, upload, and ping tests. -
Important: If your
garbage.phporempty.phpare in abackend/subdirectory (as in some original LibreSpeed setups), you'll need to adjust theurl_dl,url_ul, andurl_pingparameters inspeedtest_worker.jsaccordingly. In the current simplified version, they are expected to be in the same directory asindex.html.
-
Here's an example Nginx server block configuration. This assumes you have PHP-FPM installed and running (e.g., php-fpm or php8.x-fpm).
Create a new Nginx configuration file (e.g., /etc/nginx/sites-available/speedtest.conf) and symlink it to /etc/nginx/sites-enabled/:
server {
listen 80; # Or 443 for HTTPS
listen [::]:80; # Or 443 for HTTPS
server_name your_domain.com; # Replace with your domain or IP address
root /path/to/your-speedtest-folder; # IMPORTANT: Set this to the actual path where you placed the files
index index.html;
# Increase client body size limit for uploads (e.g., 100MB). This is an Nginx directive.
client_max_body_size 100M;
location / {
try_files $uri $uri/ =404;
}
# Pass PHP scripts to PHP-FPM
location ~ \.php$ {
include snippets/fastcgi-php.conf;
# With php-fpm (e.g. Debian/Ubuntu):
fastcgi_pass unix:/var/run/php/php8.1-fpm.sock; # Adjust PHP version as needed
# With php-fpm (e.g. CentOS/RHEL):
# fastcgi_pass unix:/run/php-fpm/www.sock;
}
# Optional: Prevent access to .ht* files if they exist
location ~ /\.ht {
deny all;
}
}After creating or modifying the Nginx configuration, test the configuration and reload Nginx:
sudo nginx -t
sudo systemctl reload nginxNote on PHP Upload Limits:
If you still encounter "Request Entity Too Large" errors after adjusting client_max_body_size in Nginx, you might also need to increase PHP's upload limits. These are set in your php.ini file, not in Nginx. Check your php.ini file for the following directives and adjust them as needed (e.g., to 100M or higher):
upload_max_filesize = 100M
post_max_size = 100MRemember to restart your PHP-FPM service after modifying php.ini (e.g., sudo systemctl restart php8.1-fpm).
-
Start your web server.
-
Open your web browser and navigate to the URL where you placed the files (e.g.,
http://localhost/your-speedtest-folder/index.htmlorhttp://your-domain.com/speedtest/). -
The speed test page will load, and you can click the "Start" button to begin the test.
-
index.html: The main HTML file that provides the user interface for the speed test. It includes the necessary JavaScript files and displays the test results. -
speedtest.js: The client-side JavaScript library that interacts with the web worker (speedtest_worker.js). It manages the test states, handles UI updates, and provides methods to start and abort the test. -
speedtest_worker.js: A Web Worker script that performs the actual speed test measurements (download, upload, ping, jitter) in the background, preventing the main browser thread from freezing. It communicates results back tospeedtest.js. -
garbage.php: A PHP script used by the download test. It generates a stream of random data for the client to download, allowing for accurate download speed measurement. -
empty.php: A very lightweight PHP script used by the upload and ping tests. For ping, it simply responds quickly to measure latency. For upload, it acts as a data sink, allowing the client to send data without the server needing to store or process it, ensuring the upload speed is measured accurately.
Feel free to explore and modify the code to suit your specific needs!