Why using top and left to position elements, instead of transform: translateY() translateX()?

[MellKam]

It's generally more performant to use transform, because it can be GPU accelerated and avoids layout recalculations.

[inokawa]

That's because we prioritize zero-configuration higher than optimization.

CSS transform can be faster in some situation. However it create a new stacking context which changes the behavior of overflowed element (ex. bvaughn/react-virtualized#122). So we don't use it, at least as default.

[MellKam]

Hmm, didn't know about that. Is there a way to switch to using transform, or do I need to create my own component wrapper for the core package?

[inokawa]

You can override style of item in some way. In Vue, you can use itemProps added in 0.39.1.
The core is not exposed yet (#428) and basically not recommended because not stabilized. And if you need more customizable virtualizer, tanstack virtual may fit more.

[inokawa]

Oh, maybe itemProps is not enough for that purpose because it can't access item offset like item prop in React.

[MellKam]

You can override style of item in some way. In Vue, you can use itemProps added in 0.39.1. The core is not exposed yet (#428) and basically not recommended because not stabilized. And if you need more customizable virtualizer, tanstack virtual may fit more.

Yeah, I actually use tanstack/virtual in my project, but in my case, the performance of the dynamic virtualizer isn't good enough. So, I’m exploring better alternatives in the ecosystem that aren't limited to React. It’s great to see other libraries like this one.