Data grid in-memory settings
These examples show the same grid built with the four available inMemory settings. While they may look the same, look at the source to see how they require different levels of data management in regards to sorting and pagination.
The grid has levels of in-memory settings that can be set. It is in the consuming application's best interest to put as much of the data grid in memory as performance allows. Try to use the highest level inMemory="sorting" whenever possible. The following values are available.
- undefined (default): When not in use the grid will not autodetect schemas. The sorting and pagination is the responsibility of the consuming application.
- enhancements: Provides no in-memory operations. If set, the grid will try to autodetect schemas only based on the content currently available (the current page of data).
- pagination: Schema detection works as above and pagination is performed in-memory. The pagination callbacks are still triggered on user interactions, but the row updates are performed by the grid.
- sorting (suggested): Schema detection and pagination are performed as above, and sorting is applied in-memory too. The onSort callback is still called and the application must own the column sort state, but data sorting is done by the grid based on the defined and/or detected schemas.
When enabled, in-memory renders cell data off-screen and uses those values to detect schemas and perform sorting. This detaches the user experience from the raw data; the data grid never has access to the backing data, only what is returned by renderCellValue.
When in-memory is not used
When inMemory is not in use the grid will not autodetect schemas. In the below example only the amount column has a schema because it is manually set. Sorting and pagination data management is the responsibility of the consuming application. Column sorting in particular is going to be imprecise because there is no backend service to call, and data grid instead defaults to naively applying JavaScript's default array sort which doesn't work well with numeric data and doesn't sort React elements such as the links. This is a good example of what happens when you don't utilize schemas for complex data.
Cell contains interactive content.
Enhancements only in-memory
With inMemory="{{ level: 'enhancements' }}" the grid will now autodetect schemas based on the content it has available on the currently viewed page. Notice that the field list under Sort fields has detected the type of data each column contains.
Cell contains interactive content.
Pagination only in-memory
With inMemory="{{ level: 'pagination' }}" the grid will now take care of managing the data cleanup for pagination. Like before it will autodetect schemas when possible.
Cell contains interactive content.
Sorting and pagination in-memory
With inMemory="{{ level: 'sorting' }}" the grid will now take care of managing the data cleanup for sorting as well as pagination. Like before it will autodetect schemas when possible.
Cell contains interactive content.