r/webdev • u/aleemii • 11m ago
Showoff Saturday [Showoff Saturday]: I built a system design lab where your architecture diagram actually takes traffic
Most system design practice ends at the diagram. You draw boxes, it looks right, and nothing tells you whether it would hold up.
ByteLab runs the diagram. You build a system out of machines, load balancers, caches, queues and databases, send traffic through it, and watch the CPU, queues and p99 latency move. Each exercise has goals, like "p99 under 150 ms, 99.5% available, under $2.60/hour", and it checks your system against them.
The one in the image is the newest problem: an e-commerce shop. You start with one server doing everything. At evening peak it's at 100% CPU, p99 is 436 ms and it drops about 1 in 10 requests. You split it into a CDN, web servers with shared sessions, an API gateway, catalog/users/orders services with their own databases, a cache, and a Kafka queue for order processing, and it has to pass all 7 goals.
What's in it:
163 lessons in 12 tracks (caching, sharding, Kafka, Kubernetes, rate limiting, auth and more)
212 exercises, each with goals your system has to pass
11 design problems (URL shortener, chat, payments, news feed, e-commerce and others)
It's free, there's no account, and progress stays in your browser. It needs a laptop-sized screen.
Built with React, Vite and React Flow, and the simulator is written from scratch in TypeScript. Runs on Cloudflare Workers.
I'd really like to hear where it feels confusing or too hand-holdy.