react-virtualized icon indicating copy to clipboard operation
react-virtualized copied to clipboard

FEATURE REQUEST: Add "Scroll Speed" value to render function parameters

Open nzayatz14 opened this issue 5 years ago • 3 comments

Feature Request

Currently, many if not all of the render functions for rows/cells have an isScrolling boolean passed into them to determine if "The Grid is currently being scrolled." It would also be nice to have some sort of metric to determine the speed of the scroll at the time.

Use Case

Currently, I have a react virtualized grid that renders multiple pieces of data across it. The rendering of each row is not super slow, but it does take some time. I would like to be able to check how quickly the user is scrolling through the table. If the scroll speed is greater than some threshold, I would like to render some sort of skeleton of the row, until the scroll speed slows down. Because I would be re-using the skeleton component for all rows, this would reduce calculation/render times and should allow for smoother scrolling at high speeds.

Idea

This scrollSpeed value would be very similar to the isScrolling boolean passed in to most render functions currently, but it would just be a number of some sort. The units would be something along the lines of cells per second, cells between onScroll calls, pixels per second, or pixels between onScroll calls.

Thanks!

nzayatz14 avatar Jun 24 '20 20:06 nzayatz14

@nzayatz14 any update on it

mtahir08 avatar Jul 01 '20 14:07 mtahir08

I want it too!

matheusAle avatar Nov 04 '20 19:11 matheusAle

you can use setInterval to calculate to get analog value

export const evalWindowScollSpeed = () => {
  let speed = 0
  let scrollTop = document.documentElement.scrollTop
  const timeScale = 100;  
  window.scrollSpeed = 0;

  setInterval(() => {
    const tempScrollTop = document.documentElement.scrollTop;
    const diffTop = tempScrollTop - scrollTop;
    speed = diffTop / timeScale;

    scrollTop = tempScrollTop;
    window.scrollSpeed = Math.abs(speed);
  }, timeScale);
}

cuijinyu avatar Dec 14 '21 08:12 cuijinyu