Skip to content

Growing collections

Roberto Prevato edited this page May 2, 2017 · 4 revisions

This page describes the features that the KingTable library offers to handle growing collections.

Abstract

Imagine a collection of items that, on average, has one new insert every three seconds. Then, imagine an interface that displays a paginated table of these items, without handling this situation:

  • A user opens an interface that loads the table: the interface shows that the collection contains a total of X items, of which is currently displaying the first 20 (page 1, 20 items per page)
  • The user spends 1 minute looking at the page, in the meanwhile 20 new items are added to the collection
  • The user clicks on the "Next page" button, going to page 2
  • Without proper handling, the table would display the first 20 items that were displayed on the first page, of 60 seconds before

A possible solution to handle this situation would be to use WebSockets, keep a connection open with each client, and automatically add the items to the clients' tables, as new items are inserted to the collection. Or, alternatively to WebSockets, using AJAX polling. But this would cause a really poor customer experience: since the rows would rapidly change on the page as the users are reading them.

Solution adopted for the KingTable

The solution adopted for the KingTable consists of a timestamp filter: when performing AJAX requests to fetch items, the table includes the timestamp of the first time the table was rendered. If the user clicks the refresh icon, this timestamp is refreshed; but otherwise it's kept unchanged. Server side logic can be implemented to return only the items that existed before this timestamp. This way, even if a table has new items every few seconds, the pagination doesn't change until the user clicks on the refresh button.

Default behavior

By default, when refreshing the web page this timestamp filter is restored from client cache; however the user sees on screen this value and can decide when to refresh the table.

How the server logic should handle the timestamp

The server should handle a timestamp coming from client side, returning only those items that existed before this time. If the timestamp is not included in the web request, it should ignore it.