Recommendations on being able to provide the exact dimensions of each item

[gioele-antoci]

I have a use case where I need to render a large number of items, each item will contain a varying but known number of children (each child has a set, known width). Therefore virtual scroll with enableUnequalChildrenSizes fits my needs best. The dimension of my items is extremely different one from the other (one child can be 100px, the other 1500px). As the user scrolls around, ngx-virtual-scroller learns more about the proper size of the children and updates the scrollLength. This introduces a noticeable jump/jitter in the UI.

One way we have found that minimizes this issue is to set a lower childWidth (which has the by--product of increasing the numberOfKnownWrapGroupChildSizes) but it's just not the right solution.

Given that in this use case I know the dimension of all the elements (rendered or not) what I am proposing is the ability to provide a function that returns wrapGroupDimensions. I'd be happy to work on this but I would appreciate some feedback/guidance.

Thanks

[gaoyajiang]

I met you with this problem. How to solve this problem，please？

[gioele-antoci]

I tried to fork the project and come up with my own solution but I found an acceptable, simpler work around. My issue was low performance while scrolling to a certain position quite a bit away from the start scroll position.

The acceptable fix I found was:

• Render the items with their final width but keep the innerHTML of those items to a minimum.
• Proceed to scroll to the position required
• On scroll position reached, finalize the rendering of those items

Let me know if you have other questions