假设我们有一个简单的例子，如下所示。
<input id="filter" type="text" />
<script>
function reload() {
// get data via ajax
}
$('#filter').change($.debounce(250,reload));
</script>
我们正在做的是引入一个小的延迟，以便在用户在输入中输入文本时减少对reload 的调用次数。
现在，我意识到这将取决于具体情况，但在给定平均（或者可能应该是最低公分母）打字/交互速度的情况下，是否存在关于去抖延迟应该多长时间的公认智慧。我通常只是玩弄价值，直到它“感觉”正确，但我可能不代表典型的用户。有人做过这方面的研究吗？
【问题讨论】：
标签： javascript user-interface user-experience
正如您所暗示的，答案取决于许多因素 - 并非所有因素都是主观的。
一般来说，使用去抖动操作的原因可以概括为具有以下两个目的之一：
要记住的一个重要数字是 250 毫秒 - 这代表了人类的（大致）中位反应时间，通常是一个很好的上限，您应该在此上限内完成任何用户界面更新以保持您的网站反应灵敏。您可以查看更多关于人类反应时间的信息here。
在前一种情况下，确切的去抖动间隔将取决于操作对双方（客户端和服务器）的成本。如果您的 AJAX 调用的端到端响应时间为 100 毫秒，那么将去抖动设置为 150 毫秒以保持在 250 毫秒的响应阈值内可能是有意义的。
另一方面，如果您的调用通常需要 4000 毫秒才能运行，您最好在实际调用中设置更长的去抖动，而不是使用第一层去抖动来显示加载指示器（假设您的加载指示器没有'不要混淆你的文本输入）。
$('#filter').change($.debounce(250, show_loading));
$('#filter').change($.debounce(2000, reload));
记住这些请求在后端的性能成本也很重要。在这种情况下，average typing speed（大约每分钟 44 个字，或大约每分钟 200 个字符）与您的用户群规模和后端容量的知识相结合，可以让您选择一个保持后端负载可控的去抖动值。
例如：如果您有一个能够每秒处理 10 个请求的单一后端和 30 个峰值活跃用户群（使用此服务），您应该选择您的去抖周期以避免超过每秒 10 个请求（理想情况下误差幅度）。在这种情况下，我们有 33.3% 的容量需要每秒处理每个用户的一个输入，因此理想情况下，我们每 3 秒最多为每个用户提供一个请求，从而为我们提供3000ms 去抖动周期。
要记住的最后一个方面是客户端的处理成本。根据您移动的数据量和 UI 更新的复杂性，这可能可以忽略不计或很重要。您想要尝试并确保的一件事是您的用户界面保持对用户输入的响应。这并不一定意味着它总是需要能够做出反应，但是当用户与其交互时，它应该对他们做出快速反应（这里的目标通常是 60FPS）。
在这种情况下，您的目标应该是以防止用户界面在用户与其交互时变得迟缓或无响应的速率去抖动。同样，统计数据是得出这个数字的好方法，但请记住，不同类型的输入需要不同的时间来完成。
例如，转录一个简短的单词通常比输入一个长而复杂的单词要快得多。同样，如果用户必须考虑他们正在输入的内容，他们往往会打字变慢。这同样适用于特殊字符或标点符号的使用。
在实践中，我使用了去抖动周期，从100ms 用于检索异常快速且对性能影响很小的数据到5000ms 用于成本更高的数据。
在后一种情况下，将短时间、低成本的去抖周期与实际计算工作的较长周期相结合，可以在用户体验和浪费操作的性能成本之间取得良好的平衡。
p>在选择这些值时，我要牢记的一件值得注意的事情是，作为每天使用键盘的人，我的打字速度可能比我的大多数用户群更快。这可能意味着对于打字速度较慢的人来说，对我来说感觉流畅自然的事情是不和谐的，因此最好进行一些用户测试或（更好）收集指标并使用这些指标来调整您的界面。
【讨论】：
275ms。在我的情况下，这个数字是去抖动的关键。