tether icon indicating copy to clipboard operation
tether copied to clipboard

tick function inefficient

Open NicBright opened this issue 7 years ago • 2 comments

I'm referring to this tick function: https://github.com/HubSpot/tether/blob/3d7119e590661f8c9e9e566c8a7640c189687215/src/js/tether.js#L62-L83

I don't get the first if block. What you're effectively doing is to queue up a lot of setTimeout calls:

if (typeof lastDuration !== 'undefined' && lastDuration > 16) {
      // We voluntarily throttle ourselves if we can't manage 60fps
      lastDuration = Math.min(lastDuration - 16, 250);

      // Just in case this is the last event, remember to position just once more
      pendingTimeout = setTimeout(tick, 250);
      return;
    }

E.g., the tick function is called for every scroll event. If processing is too slow, this will effectively do more than is necessary. Not only will there be too much unnecessary setTimeout calls. Rather, if scroll events are fired at a rapid rate, this might even lead to this block having no effect at all. Imagine: if 20 scroll events would be fired within let's say 10ms, there'd be no throttling at all because lastDuration will be decreased on each event until it's small enough for the if block to not run on the next scroll event.

NicBright avatar Mar 07 '17 16:03 NicBright

@NicBright any interest in helping improve this?

RobbieTheWagner avatar Feb 08 '20 18:02 RobbieTheWagner

Hi @rwwagner90

I'm sorry it's been a long time since I wrote that comment. Additionally, the organization I'm working for has been transitioning away from Tether since then (not on my choice, I still think Tether is great!). I therefore hope you understand that I'm not the right person any more to tackle this.

Regards, Nicolas

NicBright avatar Apr 29 '20 16:04 NicBright