Question

在我的项目scala-adapters中，我显示通过websocket发送的日志条目。

由于我无法控制发送了多少条目，因此我正在寻找避免屏幕冻结的策略。

我创建了一个ScalaFiddle来模拟：https://scalafiddle.io/sf/kzr28tq

这些参数的功能完美无缺：

setInterval(1000) { // note the absence of () =>
  entries.value += (0 to 100).map(_.toString).mkString("")
}

如果间隔变小且字符串更长 - 屏幕会冻结，例如用：

setInterval(100) { // note the absence of () =>
  entries.value += (0 to 10000).map(_.toString).mkString("")
}

是否有解决方案可以在客户端解决这个问题 - 或者我是否必须在服务器端解决这个问题？

Answer 1

您可以尝试：

@dom
def render = {
  <div>
  {
    for (entry <- entries) yield {
      entryDiv(entry).bind
    }
  }
  </div>
}

问题是您过早地绑定条目。 Binding.scala通过CPS转换实现其魔力，每个.bind触发后重新评估所有代码，因此您应该尽可能晚地绑定变量。

对于Vars，使用forreherehe而不是直接绑定，以避免更新整个列表。当您使用+=修改Vars的内容时，Binding.scala会在内部“补丁”该列表，但如果您在.bind实例上直接执行Vars以获取整个列表，框架无法为您做任何优化。