datatable.refresh() takes more than 10x as long to run than rebuilding the table from scratch
- Dominant language
- JavaScript
- Stars
- 1.3k
- Forks
- 216
- PR merge metrics
- No merged PRs in 30d
Description
The following output was collected from datatable v1.14, but I get similar output for 1.15.3
```js
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(`
`);
// 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?
Contributor guide
No contributing guide indexed for this repository
Research direction
Reproduce the timing comparison in the provided renderDatatable method using DataTable construction and refresh(), with the column format function enabled and disabled. Use browser profiling around the format callback and refresh path to identify the source of the slowdown; done means explaining the discrepancy and identifying a reliable fix or documented limitation.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend, performance
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100