145 lines
6.5 KiB
HTML
145 lines
6.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Nym MixFetch Dev</title>
|
|
<script src="bootstrap.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<h1>MixFetch Dev</h1>
|
|
|
|
<fieldset id="startup-controls">
|
|
<legend>Connection</legend>
|
|
<div>
|
|
<label><input type="radio" name="gateway-mode" value="default" checked />
|
|
Default Gateway (q2A2cbooyC16YJzvdYaSMH9X3cSiieZNtfBr8cE8Fi1)</label>
|
|
</div>
|
|
<div>
|
|
<label><input type="radio" name="gateway-mode" value="random" />
|
|
Random Gateway</label>
|
|
</div>
|
|
<details style="margin-top: 8px">
|
|
<summary style="cursor: pointer; font-size: 0.9em; color: #555">Advanced Options</summary>
|
|
<div style="margin-top: 6px; padding: 8px; background: #f9f9f9; font-size: 0.9em">
|
|
<div>
|
|
<label><input type="checkbox" id="opt-force-tls" checked /> Force TLS</label>
|
|
</div>
|
|
<div style="margin-top: 4px">
|
|
<label>Client ID: <input type="text" id="opt-client-id" size="20" /></label>
|
|
<span style="font-size: 0.85em; color: #888">(randomised on load to avoid ID reuse)</span>
|
|
</div>
|
|
<div style="margin-top: 4px">
|
|
<label><input type="checkbox" id="opt-disable-poisson" checked /> Disable Poisson packet distribution</label>
|
|
</div>
|
|
<div style="margin-top: 4px">
|
|
<label><input type="checkbox" id="opt-disable-cover" checked /> Disable cover traffic</label>
|
|
</div>
|
|
<div style="margin-top: 4px">
|
|
<label>Request timeout (ms): <input type="number" id="opt-request-timeout" value="60000" min="1000" max="300000" style="width: 80px" /></label>
|
|
</div>
|
|
</div>
|
|
</details>
|
|
|
|
<div style="margin-top: 8px">
|
|
<button id="start-mixfetch">Start MixFetch</button>
|
|
<span id="mixfetch-status" style="margin-left: 10px; color: gray">Not started</span>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<fieldset id="fetch-controls" disabled>
|
|
<legend>Quick Fetch</legend>
|
|
<div>
|
|
<input type="text" size="55" id="fetch_payload_1" value="https://api.ipify.org?format=json" />
|
|
<button id="fetch-button-1">GET</button>
|
|
</div>
|
|
<div style="margin-top: 4px">
|
|
<input type="text" size="55" id="fetch_payload_2" value="https://api6.ipify.org?format=json" />
|
|
<button id="fetch-button-2">GET</button>
|
|
</div>
|
|
<pre id="fetch-log" style="background: #f5f5f5; padding: 8px; margin-top: 8px; max-height: 150px; overflow-y: auto; font-size: 0.85em; white-space: pre-wrap; display: none"></pre>
|
|
|
|
<hr />
|
|
|
|
<h3>Stress Test</h3>
|
|
<div>
|
|
<label>Requests:</label>
|
|
<input type="number" id="stress-test-count" value="20" min="1" max="200" style="width: 60px" />
|
|
<label>Mode:</label>
|
|
<select id="stress-test-mode">
|
|
<option value="uniform">Uniform (same URL, incremented ID)</option>
|
|
<option value="mixed" selected>Mixed sizes</option>
|
|
<option value="drip">Slow drip (timeout boundary)</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div id="stress-uniform-opts" style="display: none; margin-top: 8px; padding: 8px; background: #f9f9f9">
|
|
<div>
|
|
<label>Base URL:</label>
|
|
<input type="text" size="50" id="stress-test-url" value="https://jsonplaceholder.typicode.com/posts/" />
|
|
</div>
|
|
<p style="margin: 4px 0 0; font-size: 0.85em; color: #666">
|
|
Request ID (1..N) appended to the URL. All requests are the same size.
|
|
</p>
|
|
</div>
|
|
|
|
<div id="stress-mixed-opts" style="margin-top: 8px; padding: 8px; background: #f9f9f9">
|
|
<p style="margin: 0 0 4px; font-size: 0.85em; color: #666">
|
|
Each request randomly assigned a size via <code>httpbin.org/bytes/{n}</code>.
|
|
Tests how the mixnet handles asymmetric payload sizes concurrently.
|
|
</p>
|
|
<table style="font-size: 0.9em; border-collapse: collapse">
|
|
<tr><td style="padding: 1px 10px 1px 0"><b>tiny</b></td><td>128 B</td></tr>
|
|
<tr><td style="padding: 1px 10px 1px 0"><b>small</b></td><td>1 KB</td></tr>
|
|
<tr><td style="padding: 1px 10px 1px 0"><b>medium</b></td><td>10 KB</td></tr>
|
|
<tr><td style="padding: 1px 10px 1px 0"><b>large</b></td><td>100 KB</td></tr>
|
|
<tr><td style="padding: 1px 10px 1px 0"><b>xlarge</b></td><td>1 MB</td></tr>
|
|
</table>
|
|
</div>
|
|
|
|
<div id="stress-drip-opts" style="display: none; margin-top: 8px; padding: 8px; background: #f9f9f9">
|
|
<p style="margin: 0 0 4px; font-size: 0.85em; color: #666">
|
|
Uses <code>httpbin.org/drip</code> to slowly drip bytes over a set duration,
|
|
keeping connections alive for a controlled time. Profiles are computed from
|
|
the Go timeout value below, so they always straddle the configured boundary
|
|
— some finish well before the timeout, others are mid-transfer when it fires.
|
|
</p>
|
|
<table style="font-size: 0.9em; border-collapse: collapse">
|
|
<tr>
|
|
<td style="padding: 1px 10px 1px 0"><b>safe</b></td>
|
|
<td>~50% of timeout</td>
|
|
<td style="padding-left: 10px; color: #666">well under the limit</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="padding: 1px 10px 1px 0"><b>boundary</b></td>
|
|
<td>~92% of timeout</td>
|
|
<td style="padding-left: 10px; color: #666">server-side OK, but mixnet latency pushes it over</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="padding: 1px 10px 1px 0"><b>over</b></td>
|
|
<td>~108% of timeout</td>
|
|
<td style="padding-left: 10px; color: #666">exceeds the timeout on its own</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="padding: 1px 10px 1px 0"><b>slow-start</b></td>
|
|
<td>~17% delay + ~83% drip</td>
|
|
<td style="padding-left: 10px; color: #666">late first byte, then long transfer</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
<div style="margin-top: 8px">
|
|
<label>Go timeout (ms):</label>
|
|
<input type="number" id="stress-go-timeout" value="60000" min="500" max="120000" style="width: 80px" />
|
|
</div>
|
|
|
|
<div style="margin-top: 8px">
|
|
<button id="stress-test-button">Run Stress Test</button>
|
|
<span id="stress-test-status" style="margin-left: 10px"></span>
|
|
</div>
|
|
<div id="stress-tracker" style="margin-top: 8px; font-family: monospace; font-size: 0.85em; display: none"></div>
|
|
</fieldset>
|
|
</body>
|
|
</html>
|