Android WebApp实时滚动图表随机卡顿停止问题排查求助

各位好，我现在遇到个挺头疼的问题，想请大家帮忙支支招：

我们团队做了一个Android WebApp，里面有个实时数据图表——它会每秒新增数据点，同时持续水平向左滚动，最新数据始终固定在右侧显示。正常逻辑下，只有两种情况会停掉自动滚动：要么用户手动干预了图表滚动，要么没有新数据进来。之前不管是在Android App里还是Web浏览器上，这个功能都跑得很稳，但大概一个月前，唯独在Android端的App和Chrome浏览器上，开始出现随机卡顿的问题：图表会毫无征兆地卡在某个位置，明明后台还有实时数据进来，却再也不自动滚动了。不过用户手动向右滑还是能看到最新的那些数据，就是自动滚动的功能彻底失效了。

跟大家说下我们的技术实现细节，方便排查：

• 图表是用VariableSizeList实现的，同时定义了onScroll()方法
• 我们用定时器来维持实时滚动逻辑，代码大概是这样的：

  this.realTimeScrollTimeoutId = setTimeout(() => {
    currentElement.scrollTo(currentListInnerElement.clientWidth - parentNode.clientWidth);
  });
  

• 当满足某个条件时，我们会调用clearTimeout(this.realTimeScrollTimeoutId)来停掉自动滚动，触发条件是：

  scrollOffsetRight >= totalGraphWidth - realTimeBuffer
  

• 这里的scrollOffsetRight是从React组件的ref.current.scrollOffset计算来的，totalGraphWidth取的是ref.current.clientWidth
• 正常运行时，从调试日志能看到scrollOffsetRight刚好等于totalGraphWidth - realTimeBuffer，定时器不会被提前触发清除

我自己排查了一阵，目前的猜测是：会不会有某个隐藏的事件监听器，突然让scrollOffset发生了大幅跳变，导致停止滚动的条件被意外触发？但翻了好一阵代码，也没找到具体是哪个事件或者哪里出了问题。

有没有朋友遇到过类似的场景？或者能给我一些新的排查方向？万分感谢！

内容来源于stack exchange