1

我在一个项目中使用 RxJS 5 (beta10) 。我的大部分事件都来自鼠标或触摸拖动,我只需要听到最后一个。

即我如何在 RxJS5 中做一个有损流?

在某些平板电脑上运行演示清楚地显示了当图形更新花费的时间超过浏览器的事件触发时发生的“拖拽”(这不是连续的,甚至它本身 - 浏览器似乎在他们实际告诉事情发生变化的时间间隔上进行了优化)。

通过有损数据流,我可以让用户体验始终跟上手指的步伐。


编辑:

这个答案似乎很好地总结了 RxJS5 背压的当前状态。

4

2 回答 2

1

RxJS5 auditTime方法似乎符合我的要求。

RxJS 4 油门的问题在于它给出了某个时间窗口的第一个值,而在拖动时我真的想要最后一个(如果设备的渲染速度很慢,则跳过中间值)。auditauditTime提供这个。

剩下的实际上是测试效果。我在我的事件处理程序中修改了 SVG 图形,但我不确定这些更改需要多长时间才能真正在屏幕上显示。一个简单的解决方案是让auditTime用户可以调整参数——在慢速平板电脑上,它可能需要比在台式机上稍微多一点。理想情况下,我会找到一种方法来查看浏览器渲染何时完成,然后才请求新坐标。

于 2016-07-30T22:11:07.280 回答
0

有很多不同的可能解决方案,因为有损流的定义很多。您可能想要平均拖动点,或者您可能只想查看一段时间内的第一个或最后一个。

例如throttle,将允许您仅在具有重复周期的周期内选择第一个观察值:

rxjs github repo 上的文档

返回一个 Observable,它仅在指定持续时间的连续时间窗口内发出源 Observable 发出的第一项。

基本上,如果您想等到输入静默一段时间后再采取行动,您需要 debounce。它给你一种“结束的中间流”的感觉。

如果您根本不想等待,但不希望在特定时间内处理超过 1 个观察值,您将需要限制.

更复杂的“有损”算法是可能的,但它们在很大程度上取决于您的确切用例,无论您是控制帧更新率还是至少可以挂钩,等等。

于 2016-07-28T07:58:54.180 回答