<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Jahid Hasan</title>
    <description>The latest articles on DEV Community by Jahid Hasan (@jahid_hasan_bf0c972e41776).</description>
    <link>https://dev.to/jahid_hasan_bf0c972e41776</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4175866%2F9f858bbb-d0db-4ffa-85a2-91341f14419e.jpg</url>
      <title>DEV Community: Jahid Hasan</title>
      <link>https://dev.to/jahid_hasan_bf0c972e41776</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/jahid_hasan_bf0c972e41776"/>
    <language>en</language>
    <item>
      <title>I built a free tool that shows where your system design breaks — with maths, not servers</title>
      <dc:creator>Jahid Hasan</dc:creator>
      <pubDate>Sat, 10 Oct 2026 19:06:09 +0000</pubDate>
      <link>https://dev.to/jahid_hasan_bf0c972e41776/i-built-a-free-tool-that-shows-where-your-system-design-breaks-with-maths-not-servers-nfc</link>
      <guid>https://dev.to/jahid_hasan_bf0c972e41776/i-built-a-free-tool-that-shows-where-your-system-design-breaks-with-maths-not-servers-nfc</guid>
      <description>&lt;p&gt;Whiteboard designs never push back. You draw a load balancer, two servers and a database, someone asks &lt;em&gt;"what happens at 5,000 requests per second?"&lt;/em&gt;, and nobody really knows.&lt;/p&gt;

&lt;p&gt;So I built &lt;strong&gt;&lt;a href="https://vuteem.com/tools/sys-canvas" rel="noopener noreferrer"&gt;System Canvas&lt;/a&gt;&lt;/strong&gt;: a free, browser-based canvas where you design an architecture and simulate traffic through it.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F5wkuq91oinegyfh9opw4.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F5wkuq91oinegyfh9opw4.png" alt=" " width="800" height="478"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;A design with a CDN, a load balancer, two servers in a VPC, Redis, a SQL database and a payment-service microservice.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;You can keep it to a single design, like one service with its load balancer, servers and database. Or you can model a microservice system: design each service on its own canvas, connect the services at the top level, and simulate the whole system or benchmark one service at a time.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F1nc8wuioq208jedqeg9e.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F1nc8wuioq208jedqeg9e.png" alt=" " width="800" height="478"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Each microservice gets its own canvas, listed under Services. Components are grouped by category.&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  It's maths, not a real load test
&lt;/h2&gt;

&lt;p&gt;Nothing is deployed and no real requests are sent. System Canvas estimates how your design behaves with a mathematical model built on queueing theory: &lt;strong&gt;Little's Law&lt;/strong&gt; (L = λW) and how latency climbs as a component nears 100% utilization. On top of that sit per-component rules such as cache hit ratios, connection limits and serverless cold starts.&lt;/p&gt;

&lt;p&gt;So treat the numbers as estimates, not benchmarks. The point is intuition: seeing &lt;em&gt;where&lt;/em&gt; a design strains and &lt;em&gt;why&lt;/em&gt;, before you build it. The &lt;a href="https://vuteem.com/tools/sys-canvas/docs" rel="noopener noreferrer"&gt;engine docs&lt;/a&gt; show the maths behind every component.&lt;/p&gt;

&lt;h2&gt;
  
  
  What you get
&lt;/h2&gt;

&lt;p&gt;Press &lt;strong&gt;Simulate&lt;/strong&gt; and the model reports:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;p50, p95 and p99 latency&lt;/li&gt;
&lt;li&gt;Throughput and error rate&lt;/li&gt;
&lt;li&gt;Utilization per component&lt;/li&gt;
&lt;li&gt;The bottleneck, and how far failures cascade&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F01eafv608a86kqc18ebv.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F01eafv608a86kqc18ebv.png" alt=" " width="800" height="476"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;The report: throughput, p50 and p99 latency, error rate and per-component utilization, with the formulas behind them alongside.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;There are 40 components (servers, serverless, load balancers, API gateways, CDNs, SQL and NoSQL databases, Redis, Kafka, queues, vector databases, LLM APIs and more), each with settings that change the result.&lt;/p&gt;

&lt;h2&gt;
  
  
  Try this in two minutes
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;Build Client → Load Balancer → two Servers → SQL Database.&lt;/li&gt;
&lt;li&gt;Simulate a read-heavy workload. Watch the database's utilization and the p99 latency.&lt;/li&gt;
&lt;li&gt;Add &lt;strong&gt;Redis&lt;/strong&gt; in front of the database, simulate again, and compare.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fb7qr9ic0ov9p4pu1l58n.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fb7qr9ic0ov9p4pu1l58n.png" alt=" " width="800" height="475"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;A 5-second simulation in progress: traffic moves along every connection.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Change one thing, measure, compare: that's the whole loop.&lt;/p&gt;

&lt;h2&gt;
  
  
  Also included
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;No sign-up: designs are saved in your browser&lt;/li&gt;
&lt;li&gt;Share links, PNG export, and PDF or Markdown reports&lt;/li&gt;
&lt;li&gt;An AI assistant that can build designs for you, and a phone-friendly layout&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;👉 &lt;strong&gt;&lt;a href="https://vuteem.com/tools/sys-canvas" rel="noopener noreferrer"&gt;vuteem.com/tools/sys-canvas&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;If a result looks wrong, tell me in the comments. That's how the model gets better.&lt;/p&gt;




&lt;p&gt;&lt;em&gt;I'm Jahid Hasan &lt;a href="https://vuteem.com" rel="noopener noreferrer"&gt;vuteem.com&lt;/a&gt;.&lt;/em&gt;&lt;/p&gt;

</description>
      <category>systemdesign</category>
      <category>softwareengineering</category>
      <category>architecture</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
