Architecture Tradeoff Simulator

Explore system design decisions in real-time

Scenario Presets
Components
Traffic Parameters
Requests/sec 500
Payload Size 50 KB
Cache Hit Rate 70%
View Calculation Assumptions

Latency: Base 20ms + CDN(-10ms) + Cache(-8ms) + DB(15ms) + Queue(5ms) + Replicas(+5ms cross-region) + Traffic multiplier

Cost: $50 base + Traffic($0.001/req) + CDN($200) + Cache($150) + DB($300) + Replicas($400) + Queue($100) + Multi-region(2x)

Reliability: Base 85 + CDN(+5) + Cache(+3) + Replicas(+7) + Multi-region(+10) - Traffic penalty

Complexity: 20 + Components(+10-15 each) + Multi-region(+20) + Rate limiting(+8)

P95 Latency
45ms
Monthly Cost
$850
Reliability
93/100
Complexity
65/100
×

Component Name

Role

Why It Exists

Common Pitfalls

    Key Signals/Metrics

      Mitigation Strategies

      📚 How This Tool Works

      🎯 What Is This?

      Think of this like a video game where you're building a city, but instead of buildings, you're building a website or app's "behind-the-scenes" system. You get to see what happens when you add different pieces and how they affect speed, cost, and reliability!

      🎮 How to Use It

      Step 1: Look at the 3D scene in the middle. Those colorful boxes are parts of your system, and the glowing balls moving between them are like "requests" (people asking for information).

      Step 2: Use the panel on the left to turn parts ON or OFF and move sliders to change settings.

      Step 3: Watch the 4 numbers in the top-right change! These show you how your choices affect everything.

      Step 4: Click on any colorful box to learn what it does and what problems it can have.

      🔤 What Do These Words Mean?

      🌐 CDN (Content Delivery Network) Like having copies of your homework closer to your teacher so you can hand it in faster. It stores copies of your website in different cities around the world.
      💾 Cache Like your brain remembering the answer to 2+2 instead of calculating it every time. It remembers common answers so it doesn't have to look them up again.
      📬 Message Queue Like a line at the cafeteria - tasks wait their turn to be done. Helps when you have too many things happening at once.
      🌍 Multi-Region Having backup systems in different countries. If one breaks, another can take over!
      📚 Read Replicas Like making photocopies of a popular library book so more people can read it at the same time.
      🚦 Rate Limiting Like a bouncer at a club - only lets a certain number of people in at once so it doesn't get too crowded.

      📊 The 4 Important Numbers

      ⚡ Latency (Speed) How long it takes for someone to get their answer. Lower = faster = better! Like how fast you can pass a note in class.
      💰 Cost How much money you pay each month to run everything. More fancy parts = more expensive, like buying more toys costs more money.
      ✅ Reliability How often your system works correctly without breaking. Higher = better! Like how your favorite toy breaks less than a cheap one.
      🧩 Complexity How hard it is to build and fix your system. Lower = simpler = easier! Like building with 10 LEGO pieces vs 1000 pieces.

      🎪 Try These Fun Experiments!

      • The Speed Test: Turn ON CDN and Cache, set traffic to LOW. Watch your latency drop super fast!
      • Black Friday: Choose "Ecommerce Peak" preset and watch what happens when tons of people shop at once!
      • Disaster Proof: Turn ON Multi-Region and Read Replicas. Your reliability goes way up because you have backups!
      • Budget Mode: Turn everything OFF and use low traffic. Super cheap but slow and less reliable.
      • The Traffic Jam: Crank traffic slider to MAX. Watch the database turn red because it's stressed!

      💡 Cool Ways to Use This

      • Teach Your Team: Show coworkers how different choices affect the system in real-time
      • Plan Before Building: Test different setups before spending real money
      • Explain to Your Boss: Show why you need that expensive cache by demonstrating the speed improvement
      • Job Interviews: Impress interviewers by walking through tradeoffs visually
      • Learn Architecture: Play around and learn what each piece does without breaking anything real!
      • Client Presentations: Help non-technical clients understand why certain features cost more

      📱 Mobile Tips

      On your phone? Tap the ☰ button at the bottom-left to open controls. Pinch to zoom the 3D scene. Tap any box to learn about it!