Quarterly Update - Spring 2022

By adminยท

This spring, we've been hard at work preparing for our Autumn release.

We have implemented a few new functionalities:

And we have updated some of the existing features:

  • lazy grouping
    • expands lazy loaded rows correctly and
    • also the server response can contain multiple levels of children, which basically allows the backend to send more data for groups you don't want to load lazily
  • column groups are now improved with support for proportional column resizing
  • pivot columns are now easier to style and customize

Coming soon

At the end of the spring, we started working on row and cell selection and we've made good progress on it.

Row selection is already implemented for non-lazy group data and we're working on integrating it with lazy group data (e.g groups lazily loaded from the server). Of course, it will have integration with checkbox selection.

Multiple row selection will have 2 ways to select data:

  • via mouse/keyboard interaction - we've emulated the behavior you're used to from your Finder in MacOS.
  • via checkbox - this is especially useful when the table is configured with grouping.

New Features

Column Resizing

By default columns are now resizable. You can control this at column level via column.resizable or at grid level via resizableColumns.

Find out more on column resizing

Read more about how you can configure column resizing to fit your needs.

Resizable columns example

For resizable columns, hover the mouse between column headers to grab & drag the resize handle.

Hold SHIFT when grabbing in order to share space on resize.

A nice feature is support for SHIFT resizing - which will share space on resize between adjacent columns - try it in the example above.

Column Reordering

Read more on column order

Column order is a core functionality of InfiniteTable - read how you can leverage it in your app.

The default column order is the order in which columns appear in the columns object, but you can specify a defaultColumnOrder or tightly control it via the controlled property columnOrder - use onColumnOrderChange to get notifications when columns are reordered by the user.

Column order

Keyboard Navigation

Both cell and row navigation is supported - use keyboardNavigation to configure it. By default, cell navigation is enabled.

Keyboard navigation

This example starts with cell [2,0] already active.

Updated Features

Lazy grouping

Server side grouping has support for lazy loading - InfiniteTable will automatically load lazy rows that are configured as expanded.

Lazy loaded rows are properly expanded

In this example, France is specified as expanded, so as soon as it is rendered, InfiniteTable will also request its children.

Another nice feature is the ability for a group node to also contain its direct children in the server response, which basically allows the backend to eagerly load data for certain groups.

More on lazy grouping

Lazy grouping (with or without batching) is an advanced feature that allows you to integrate with huge datasets without loading them into the browser.

Column grouping

Column grouping was enhanced with support for pinned columns. Now you can use them in combination.

More on column groups

Column groups is a powerful way to arrange columns to fit your business requirements - read how easy it is to define them.

Column groups with pinning

Note the country column is pinned at the start of the table but is also part of a column group


Pivot columns are now easier to style and benefit from piped rendering to allow maximum customization.

Pivoting docs

Pivoting is probably our most advanced use-case. We offer full support for server-side pivoting and aggregations.

Customized pivot columns

Pivot columns for the canDesign field are customized.