Performance tip for big tables

For anyone wanting their table to perform faster!

TLDR: precalculate your dataFormat functions!

I have a complex table with hundreds or thousands of rows and most of the columns have a dataFormat function.

So when the bootstrap table is rendered, a huge number of function calls are executed whilst each row is rendered, and each row needs to go and recalculate the dataFormat function for each cell.

It is less work for the react bootstrap table if you create your table data first, transform all the data into the state that you want it to be, then give it to react-bootstrap-table to render, ideally with no dataFormat column functions.

If the table is rerendered alot this will make it much faster.

I have also asked Allen if it is possible to put JSX into the data field instead of a string. This will make it possible to prerender the component that goes into each cell and then bootstrap table just needs to render it. This would allow for further optimization.