Doherty Threshold

도허티 임계값

Keep system response under 400ms and users stay in flow; go slower and attention drifts elsewhere.

···
html
<div class="stage">
  <div class="pane"><div class="tag">✓ &lt;400ms</div>
    <button class="btn" id="b1">Click</button>
    <div class="bar"><div class="fill fast"></div></div>
    <div class="ok" id="ok1">✓ flow</div>
  </div>
  <div class="pane"><div class="tag">✗ &gt;400ms</div>
    <button class="btn" id="b2">Click</button>
    <div class="bar"><div class="fill slow"></div></div>
    <div class="away" id="ok2">⇄ distracted</div>
  </div>
</div>
css
.stage{width:94%;height:88%;display:flex;gap:6%}
.pane{position:relative;flex:1;border-radius:14px;border:1px solid var(--line);background:var(--surface);display:grid;place-items:center;gap:10px;overflow:hidden}
.tag{position:absolute;top:8px;left:10px;font:700 10.5px/1 monospace;color:var(--muted)}
.btn{border:1px solid var(--line);border-radius:8px;padding:8px 16px;background:var(--bg);font-size:12px;font-weight:700}
.bar{width:70%;height:5px;border-radius:3px;background:var(--line);overflow:hidden}
.fill{height:100%;background:var(--accent);width:0}
.fast{animation:g .35s ease-out infinite}
.slow{animation:g 1.8s ease-out infinite}
@keyframes g{0%{width:0}55%{width:100%}100%{width:100%}}
.ok,.away{font:700 11px/1 monospace;opacity:0}
.ok{color:var(--accent-3);animation:show .35s ease-out infinite}
.away{color:var(--accent-2);animation:show 1.8s ease-out infinite}
@keyframes show{0%,60%{opacity:0}75%,90%{opacity:1}100%{opacity:1}}

IBM researchers Walter J. Doherty and Ahrvind J. Thadhani proposed this figure in a 1982 paper studying computer response time and productivity. 400ms sits near the minimum delay people perceive as slow — faster than that, and people feel like they're driving the system, not waiting on it.

When real server response can't stay under 400ms, skeleton screens and optimistic UI become the practical fix — they reduce *perceived* latency, which is a different axis from actual latency.

Left responds within 400ms and the user flows straight into the next action. Right crosses the threshold, and the user's attention visibly drifts elsewhere.

When to use

When a screen depends on a slow API, aim to at least *react* within 400ms — even if the real work takes longer.