search

bvaughn / react-window

React components for efficiently rendering large lists and tabular data
https://react-window.now.sh/
MIT License
15.81k stars 785 forks source link

Hardware/GPU acceleration #564

Closed k4my4b closed 1 month ago

k4my4b commented 3 years ago

I was wondering if react-window uses transform/translate(2d/3d) to offset the elements which would be composited on the gpu layer

joshwilsonvu commented 3 years ago

Check https://github.com/bvaughn/react-window/blob/b0a470cc264e9100afcaa1b78ed59d88f7914ad4/src/createListComponent.js#L471, you'll see that it uses absolute positioning.

shijiatongxue commented 2 years ago

I was wondering if react-window uses transform/translate(2d/3d) to offset the elements which would be composited on the gpu layer

+1

Maybe scroll items should have a wrapper, and then transform the wrapper. This won't cause layout and can use hardware acceleration。