DEV Community

Cover image for I built a network failure simulator in a single HTML file
Alex A.
Alex A.

Posted on

I built a network failure simulator in a single HTML file

I wanted a tool to run NOC failure drills without
setting up a lab. Everything I found was either
too heavy or required a server. So I built Simvex.

What it does

  • Simulates link failures and automatic rerouting
  • Connects to RIPE Atlas API for real latency data
  • ML anomaly detection (EMA Z-score + cooldown)
  • Load any topology via JSON
  • Export PDF reports, CSV, SVG, JSON topology
  • Zero install — single HTML file, open in browser

The interesting parts

Particles without re-creating DOM nodes
The traffic animation initially called remove()
and enter() every second. At scale it was slow.
Fixed by building the array once and only calling
.attr() on existing elements each step.

ML without spam
Raw Z-score on noisy latency data fires alerts
constantly. Added EMA smoothing (α=0.3) before
the Z-score calculation, plus a 5-step cooldown
between alerts. Alert spam dropped to zero.

Resize without rebuilding the map
Used ResizeObserver on the container — when size
changes, repositionSvg() recalculates W/H and
moves all SVG elements via .attr(). No rebuild.

Tech stack

Pure HTML/CSS/JS. D3.js for the network map.
Chart.js for latency history. jsPDF for reports.
No framework, no backend, no install.

Try it

https://simvex.gumroad.com/l/idxysp

Happy to answer questions about the implementation!

Top comments (1)

Collapse
 
alex_a_fbd71c0955 profile image
Alex A.

Happy to answer any questions about the implementation!

The most interesting challenge was the ML part — raw Z-score on noisy latency data fires alerts every
few seconds. EMA smoothing before the Z-score fixed it
completely.

Also the RIPE Atlas integration works without an API key
for public measurements — just click Connect and it pulls
real internet latency data.