Skip to content
This repository has been archived by the owner on Oct 1, 2021. It is now read-only.

Can this be used for virtualized table rows? #105

Open
domenic opened this issue Jun 13, 2018 · 2 comments
Open

Can this be used for virtualized table rows? #105

domenic opened this issue Jun 13, 2018 · 2 comments

Comments

@domenic
Copy link
Collaborator

domenic commented Jun 13, 2018

A common use case on the web is data tables, using the <table> element... but virtualized.

Can this be done using our implementation?

(Note: column auto-sizing seems basically impossible. All columns would have to be fixed width.)

I can see a few paths here:

  • Try to hack it by creating a DOM structure that goes table > virtual-scroller > tr. This can only be done with DOM APIs; the parser will transform that into virtual-scroller + table > tr. If this can be made to work, we could consider making it easier to use somehow.
  • Assemble a virtualized-table using the same internal components we're currently using for virtual-scroller. Then, either:
    • Consider shipping virtualized-table alongside virtual-scroller
    • Change virtual-scroller's implementation in some way so that it can encompass both cases
    • Wait until we expose the internal pieces (How to ship virtual-list-element.js dependencies? #27) and have people build virtualized tables from that.

This seems like an area ripe for exploration and hacking around.

@valdrinkoshi
Copy link
Collaborator

valdrinkoshi commented Jun 13, 2018

Even if controversial, using is="" would really help here, as we could do something like this

class VirtualTableElement extends VirtualScrollerMixin(HTMLTableElement) {
  // ...
}
customElements.define('virtual-table', VirtualTableElement, { extends: 'table' });

and use it like this

<table is="virtual-table">
 <template> <tr><td>cell!</td></tr> </template>
</table>

(note: VirtualScrollerMixin would be where most of the current implementation relies)

@domenic domenic added the feature for now A feature we could and probably should add now label Aug 15, 2018
@oswee
Copy link

oswee commented Dec 11, 2018

Virtual tables are really important in enterprise grade SaaS (which are important for GCP :) ). All CRMs, ERPs, "you-name-it" use a huge amount of tables/data grids and virtual scrolling is critical there, because old school pagination is no more suitable and pretty impossible to work with.
Long time ago in some demo project we was testing ExtJS buffered grid. Was working pretty fine. Probably worth to look into because it is one of most "enterprise'e" framework and probably are accumulating huge amount of expertise.
I am not an expert in programming. More like a PO. But yesterday had an idea to try this together with websockets or grpc-web kinda thing. I mean some kind of data streaming.

@domenic domenic removed the feature for now A feature we could and probably should add now label Apr 17, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants