javascript - 可排序用户列表最佳实践

Question

我正在尝试做一个可以让多个用户同时登录的网络服务。在 Nodejs 服务器上，有一个包含所有用户的未排序数组。以及包含所有用户的数据库。

每个用户始终可以在 HTML Bootstrap 表中看到每个用户在线，其中包含用户名、ID、在线时间等不同列......并且还有包含在线和离线用户的组列表。重要的是，该表应该每 3-5 秒更新一次。

我希望用户能够通过单击列的表标题对在线用户表进行排序。这样做的最佳做法是什么？

我目前只能想到两种不同的解决方案，对我来说似乎都不完美。

<强>1。使用 Bootstrap 排序

我以用户希望列表排序的方式保存信息。然后我收到未排序的数据并用它填充表格，之后我将触发标题上的单击并再次以相同的方式对表格进行排序。

但如果我这样做，我认为用户总是会注意到表被重新填充，然后如果每 3-5 秒完成一次，就会再次排序。

<强>2。在服务器上保留排序列表

始终将用户的所有不同排序列表保留在我的服务器上，并让服务器每 3-5 秒对它们进行新排序。然后当客户端请求时，将他当前想要的排序列表发送给客户端，并填充Table HTML。

但这样我认为它会使用我服务器上的相当多的资源，因为它还必须对一些混合的在线/离线用户进行排序，这将是我必须在服务器上不断保存和重新排序的许多不同的表。

有没有更好的方法来为客户端实现许多可排序的用户列表？

Answer 1

关于 UI 的重要一点是减少闪烁和任何类型的延迟。在数据显示在表格中之前，首先尝试在用户端测试排序。您不想触发点击事件，因为这可能会在数据进入、显示、排序然后再次显示时产生闪烁效果。如果由于某种原因排序花费的时间太长，这可能会导致用户界面出现滞后或不稳定，因此请对其进行测试，看看感觉如何。如果客户端性能不佳，我只会关注服务器端。检查您的 CPU 和 RAM，看看如何最好地处理这个问题。动态排序可能可以根据您的设置进行，或者如果您有多余的内存，也可以选择将其保存在 RAM 中。

服务器端存储在 ram 中的站点范围或线程引擎变量中。如果你能摆脱它，线程引擎变量将是最快的选择，但成本将是 SORTEDDATA_BYTES * WEB_THREADS。

Array.prototype.keySort = function(k, descending) {
  var z = descending === true ? -1 : 1;
  this.sort(function(a, b) {
    return a[k] > b[k] ? 1*z : a[k] < b[k] ? -1*z : 0;
  });
  return this;
};

var sortedJSON = {
  UsernameAsc: JSON.stringify(data.keySort("Username")),
  UsernameDesc: JSON.stringify(data.keySort("Username", true)),
  IdAsc: JSON.stringify(data.keySort("Id")),
  IdDesc: JSON.stringify(data.keySort("Id", true))
};