Performance issues with Grid.js and scrollTop check
See original GitHub issueHi thank you for this library, it’s amazing.
I want to ask what the need of this check?
I have a component which in some situations animate scrollTop
property of VirtualScroll
component, and even in production I got 30-50ms per frame (I have a lot of lines on the screen).
It’s because check causes reflow. Just removing this line highly (4+ x times) increases performance of my component without lose of any functionality. I got stable 8ms per frame on scroll animation.
I’ve read your comments about autoHeight coupling, and what I want is another boolean property and I know that it’s bad idea.
May be you have any ideas about how to remove this check? Or move all that checks outside control?
Issue Analytics
- State:
- Created 7 years ago
- Comments:40 (25 by maintainers)
Top Results From Across the Web
Scroll to bottom (and forced reflow performance issues)
Try div.scrollTop = div.scrollHeight : var contents = document.querySelector('.contents'); const before = new Date().getTime(); contents.
Read more >JavaScript Grid: Scrolling Performance
JavaScript Grid : Scrolling Performance · 1. Setting Expectations · 2. Check Cell Renderers · 3. Create Fast Cell Renderers · 4. Turn...
Read more >Five Fast JavaScript Data Grids — A Performance Review
In this article, we compare the performance of some of the most popular JavaScript grid components on the market, measuring both the initial ......
Read more >HTML DOM Element scrollTop Property
The number of pixels the element's content is scrolled vertically. If the number is negative, the number is set to 0. If the...
Read more >Common bugs in React Native ScrollView and how to fix ...
Correctly using onScroll and tracking scroll position may be a tricky task due to performance reasons. This is why it's always important to ......
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Unfortunately that used to be how it worked but it caused problems for certain use-cases of
scrollToRow
/scrollToColumn
(see issue #399).In your case, you could ignore
onScroll
events withscrollTop
values that match your component’sstate
(or wherever you’re storing thescrollTop
prop)?That’s so great to hear!! 👏 😀 Thanks @istarkov!