Use with TABLE

[Carsten Sørensen]

Hi,
I have tried various ways to get a traditional TABLE / TR layout to work with the uni-virtualizer - but can't find a way to make it work. What I am trying is to virtualize the TR's of a TBODY - and I have tried making each TR a separate TBODY too - but I can't get it to work. I have tried both the lit-element and the attach approach.
Should it work?
Thanks in advance!

[graynorton]

The short answer is that it doesn't work.

We did some experimentation along these lines in an earlier phase of the project and it seemed tantalizingly close, but the techniques we use to position children and size the body to account for virtual items just don't play nicely with the browser's native table layout behavior.

It's probably possible to end up somewhere good by either:

• Using actual <table> markup but using the CSS display property to override the standard table layout behavior

• Using non-standard markup but specifying aria table roles to indicate table semantics and ensure accessibility

We'd like to try these out, identify any issues, and offer some guidance and examples, but this is not currently above the line, priority-wise.

[Serhii Kulykov]

Using actual <table> markup but using the CSS display property to override the standard table layout behavior

This is the approach we are using in vaadin-grid which uses <table> in Shadow DOM.

There is an experimental branch with a proof of concept of using VirtualScroller. We consider it as a future replacement for our internal copy of iron-list for implementing infinite scrolling.

[Carsten Sørensen]

Thanks both of you!! I think most of the "virtual" implementations I have investigated until now has been relying on CSS display and some sort of fixed sizing of TD widths and TR heights. I have an own implementation that instead uses pages of TBODY's insertBefore / insertAfter that kind of solves the problem - but it is not as elegant as the virtualizer implementation.
I made that solution for TABLE before implementing my first uni-virtualizer implementation on general UL/LI listings - and I was impressed about the speed of your virtualizer. I am lazy loading pages of records using a worker in my solution too which might be the biggest difference in speed... to your implementation. Probably a combination of the two solutions might be a solution for TABLE where the TR heights and column widths should be driven dynamically by the TD content...
If I am successful in a generic solution - and can see it mixed with the uni-virtualizer I will let you know the results.
Thanks!

[Carsten Sørensen]

Using actual <table> markup but using the CSS display property to override the standard table layout behavior

This is the approach we are using in vaadin-grid which uses <table> in Shadow DOM.

There is an experimental branch with a proof of concept of using VirtualScroller. We consider it as a future replacement for our internal copy of iron-list for implementing infinite scrolling.

Thanks for the link! Cool stuff you have! Only thing that I initially see as an issue is the "overflow" in cells that gets "..." - which not always is the requirement - but for a majority of tables your grid seems pretty cool! and also with lazy loading stream etc.! Cool!