When I started looking into PC building, one of the most confusing topics I ran into was bottlenecks. Everyone on forums had strong opinions, but there was never a clear or simple way to check if a CPU and GPU would work well together. Some said it depends on the game, others said it is all about benchmarks, and many simply said “it depends.”
That confusion gave me the idea to build a simple tool: a PC Bottleneck Calculator. It lets you pick a CPU and GPU from a list and tells you the bottleneck percentage. The lower the percentage, the better the balance.
What is a bottleneck
In simple words, a bottleneck happens when one component is holding back the performance of the other.
• If you use a very strong GPU with a weak CPU, the GPU will sit idle because the CPU cannot process instructions fast enough.
• If you use a powerful CPU with a low tier GPU, the CPU will be underutilized because the GPU cannot keep up.
The key point is that bottlenecks are not about “bad hardware.” They are about balance. Even good parts can bottleneck each other if they are mismatched.
How the calculator works
The goal of the calculator was to give users a quick way to see whether their build was balanced without having to read through dozens of benchmarks.
Here is the simple logic:
- Each CPU and GPU is given a performance score.
- The scores are compared.
- The calculator shows the percentage of how much one part is limiting the other. Unlike some tools that show a “match score” where higher is better, my tool shows the bottleneck percentage, where lower is better. For example: • If the bottleneck is below 10 percent, the build is very balanced. • If it is 20-30 percent, you will notice some limitations. • If it is above 30 percent or more, one part is clearly holding back the other.
The core code
Here is a simplified version of the calculation logic:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>PC Bottleneck Calculator</title>
</head>
<body>
<h2>Check CPU and GPU Bottleneck</h2>
<select id="cpu">
<option value="95">Intel Core i9-14900K</option>
<option value="75">Ryzen 5 5600</option>
<option value="60">Intel Core i5-10400F</option>
</select>
<select id="gpu">
<option value="100">NVIDIA RTX 4090</option>
<option value="85">NVIDIA RTX 4070</option>
<option value="65">GTX 1660 Super</option>
</select>
<button onclick="calculate()">Calculate</button>
<p id="result"></p>
<script>
function calculate() {
const cpuScore = parseFloat(document.getElementById("cpu").value);
const gpuScore = parseFloat(document.getElementById("gpu").value);
const weaker = Math.min(cpuScore, gpuScore);
const stronger = Math.max(cpuScore, gpuScore);
const bottleneck = ((stronger - weaker) / stronger * 100).toFixed(1);
document.getElementById("result").innerText =
`Estimated Bottleneck: ${bottleneck}% (lower is better)`;
}
</script>
</body>
</html>
Open this in a browser, pick a CPU and GPU, and you will see the bottleneck percentage right away (Its demo). The real version on my site uses a much larger dataset, but the core idea is the same.
Challenges I faced
• Data accuracy: Getting performance scores that reflect real world performance is tricky. Benchmarks differ from site to site, and results vary by workload. I had to normalize scores to keep comparisons consistent.
• Explaining results: A percentage alone is not helpful. I added explanations to tell users whether the bottleneck is minor, noticeable, or severe.
• Edge cases: Older CPUs or integrated graphics sometimes broke the logic. I had to add conditions so the tool does not give misleading results.
What I learned
• You do not need a huge framework or complex backend to make something useful. This project was built with plain HTML, CSS, and JavaScript.
• Clear communication matters more than complex math. The hardest part was explaining what the percentage really means to an everyday PC builder.
• Even a small tool can save time and help people. What started as a personal experiment turned into something useful for anyone planning a new PC build.
Try it out
If you are curious, you can try the full version here: https://pcbottleneckcalculator.io
It might save you some frustration before buying parts that do not work well together.
Top comments (2)
Nice breakdown of the logic behind the bottleneck tool. The concept is clear, but I’m curious, where do you usually get the benchmark or performance data for CPUs and GPUs?
Is it PassMark, UserBenchmark, or do you maintain your own dataset?
Good catch! The tool uses publicly available benchmark data from sites like PassMark and other performance databases.
I don’t maintain my own dataset (that would be huge), but I rely on those established sources since they’re regularly updated and widely used for comparison.
The calculator then processes that data to estimate the bottleneck percentage between CPU and GPU.