datatable.refresh() takes more than 10x as long to run than rebuilding the table from scratch
The following output was collected from datatable v1.14, but I get similar output for 1.15.3
renderDatatable(data=null) {
console.time('rendertable');
// display the table
this.form.set_df_property(this.formAttr.section, 'hidden', false);
this.form.fields_dict[this.formAttr.section].collapse(false);
// set up the field to receive the datatable
this.form.get_field(this.formAttr.field).html(`
<div id='${this.formAttr.sel.substring(1)}'></div>
`);
// render the datatable
this.table = new DataTable(this.formAttr.sel, {
...this.datatableOptions,
columns : this.columns,
data : data || this.data.tableData,
});
console.timeEnd('rendertable');
console.time('REFRESH');
this.table.refresh();
console.timeEnd('REFRESH');
}
Rendering the table with two rows:
rendertable: 60.090087890625 ms
REFRESH: 666.958984375 ms
60ms seems reasonable to create a table with two rows. Note that I have a format function that runs on most columns. 667ms refresh is an over 10x as slow though. What could be causing the slowdown?
There are inconsistencies, although no practice workarounds that I have discovered aside from re-creating the table from scratch.
This is quite interesting: when I profile my cell format method, the initial table render takes longer (expected, since I'm writing to the log), but the refresh no longer takes extra time to run. Note that I am unable to replicate the speedup in the refresh method by simply forcing the format function to take longer; it only appears to respond to console.time():
formatting: 0.02001953125 ms
formatting: 0.01904296875 ms
formatting: 0.004150390625 ms
formatting: 0.005126953125 ms
formatting: 0.004150390625 ms
formatting: 0.00390625 ms
formatting: 0.003173828125 ms
formatting: 0.00390625 ms
formatting: 0.002685546875 ms
formatting: 0.004150390625 ms
formatting: 0.0087890625 ms
formatting: 0.003662109375 ms
formatting: 0.004150390625 ms
formatting: 0.004150390625 ms
formatting: 0.00390625 ms
formatting: 0.004150390625 ms
formatting: 0.01513671875 ms
formatting: 0.007080078125 ms
formatting: 0.004150390625 ms
formatting: 0.003173828125 ms
formatting: 0.003173828125 ms
formatting: 0.003173828125 ms
formatting: 0.0029296875 ms
formatting: 0.0048828125 ms
formatting: 0.0029296875 ms
formatting: 0.00390625 ms
formatting: 0.001953125 ms
formatting: 0.001708984375 ms
formatting: 0.0029296875 ms
formatting: 0.003173828125 ms
formatting: 0.004150390625 ms
formatting: 0.004150390625 ms
formatting: 0.003173828125 ms
formatting: 0.0048828125 ms
rendertable: 364.31201171875 ms
formatting: 0.005859375 ms
formatting: 0.00390625 ms
formatting: 0.0029296875 ms
formatting: 0.007080078125 ms
formatting: 0.003173828125 ms
formatting: 0.002685546875 ms
formatting: 0.00390625 ms
formatting: 0.0029296875 ms
formatting: 0.003173828125 ms
formatting: 0.003173828125 ms
formatting: 0.0029296875 ms
formatting: 0.0029296875 ms
formatting: 0.003173828125 ms
formatting: 0.003173828125 ms
formatting: 0.002685546875 ms
formatting: 0.0029296875 ms
formatting: 0.0029296875 ms
formatting: 0.002685546875 ms
formatting: 0.003173828125 ms
formatting: 0.003173828125 ms
formatting: 0.0029296875 ms
formatting: 0.003173828125 ms
formatting: 0.001953125 ms
formatting: 0.0029296875 ms
formatting: 0.001953125 ms
formatting: 0.0029296875 ms
formatting: 0.003173828125 ms
formatting: 0.001708984375 ms
formatting: 0.003173828125 ms
formatting: 0.002197265625 ms
formatting: 0.004150390625 ms
formatting: 0.001953125 ms
formatting: 0.0029296875 ms
formatting: 0.0029296875 ms
REFRESH: 383.912109375 ms
What's going on here?