Tabulator: ajax loading + remote pagination + progressive rendering

[KimBelanger]

Is it possible to combine: ajax loading + remote pagination + progressive rendering in working together ?

ie: Loading first 20 items from server, when approaching bottom of list, load next 20, and automatically switch pagination display.

Kind of an infinite scrolling with manual paging controls displayed and dynamically updated if needed.

I do something of the sort with _datatables_, but i grew some hate for that library, yours seems more fun to work with ;)

Thanks !

[olifolkerd]

Hey,

Thanks for getting i touch, you cant do ajax progressive rendering at the moment but that is a great idea!

it should be fairly easy to implement, so i will get it in the next release in a couple of weeks.

i will post a link on here when it is up and available.

[michaelkaldeck]

That would be really great. What would be the best, if this would be independent of paging. I mean, data is loaded incerementally from server reacting to scrolling, wether you have a pager or not.

[olifolkerd]

that is exactly how i will implement it, so from a servers perspective it is paging, but from an end uers point of view it will just look like they are scrolling.

I should have that in, in the next couple of weeks

[michaelkaldeck]

magnificent, splendid, superb, .....!!!

[chdh]

When no paging is used at the client, will the full table be loaded into the DOM (progressively and asynchronously from top to bottom)? Or will you use a viewport / virtual table model, so that only the data of the currently visible cells is kept in the client (with some pre-loading or caching of extra data for faster scrolling to adjacent or previously displayed rows)?

[olifolkerd]

At present the the elements are loaded into the viewport as the user scrolls down to them, with a few pre-loaded beyond the bottom of the element to enable smooth scrolling. No elements are removed once rendered.

I could certainly add a strict progressive rendering mode that removes elements once they are no longer visible (give or take a smooth scrolling safety margin) if that would be of interest, as i can see that enhancing performance on lower spec devices.

[chdh]

It's not only necessary for lower spec devices, but for scrolling through very large tables.
Example
Theory

[olifolkerd]

Tabulators progressive rendering as it currently stands works well on tables upto 10,000 as tested in real world use. but i take you point that for very large tables a more aggressive form of rendering would be beneficial.

I will add it to the road map.

[olifolkerd]

You will be happy to heat Ajax based progressive rendering is now available.

$("#example-table").tabulator({
    progressiveRender:"remote", //enable progressive rendering
    ajaxURL:"/data/page", //set the ajax URL
});

Full documentation can be found here