How to debug slow .columns.adjust()?

How to debug slow .columns.adjust()?

TablefakTablefak Posts: 33Questions: 7Answers: 0
edited April 8 in Free community support

Hi. I haven't been able to make a minimal reproducible example, so far. The problem I'm facing is that calling table.columns.adjust() gets slow.

Observations

  1. Each next call is slower that the previous one.
  2. The more rows I have in the table, the slower it gets.

Measurements

I measured the time it takes for an adjust() call with different number of rows in the table. I called adjust() multiple times, not doing anything in between the calls. Each line is the time it takes for the next call.

10k rows
1) 15s
2) 50s

5k rows
1) 3s
2) 12s
3) 20s
4) 31s

1k rows
1) 0.1s
2) 0.4s
3) 0.7s
4) 1.3s
5) 1.6s
6) 1.9s
7) 2.2s
8) 2.7s

Datatable init

DataTable({
        select: {
            style: "multi+shift"
        },
        searching: true,
        scrollX: false,
        data: [],
        deferRender: true,
        processing: true,
        rowId: "uid",
        language: {
            url: "datatables_x.json"
        },
        pageLength: 50,
        lengthMenu: [10, 50, 100, 500],
        fixedHeader: true,
        dom: 'rt<"float-start clearfix"l>p',
        order: [[7, 'desc']],
        columnDefs: [
            {
                target: '_all',
                className: 'dt-center',
                orderSequence: ["desc", "asc"],
            }
        ],
        columns: [...]
})

Additional info

"datatables.net": "1.13.8"
Google Chrome

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

Answers

  • colincolin Posts: 15,158Questions: 1Answers: 2,587

    I just tried it with 5k rows and the latest releases, see here, and it takes less than a second consistently. I'd suggest updating your code base to the most recent libraries (you are on 1.x rather than the new&improved 2.x version), and see if that problem still occurs for you.

    Could you look at that, please, and see if it helps. If it's still not working for you, please can you update my example, or link to your page, so that we can see the problem.

    Colin

  • TablefakTablefak Posts: 33Questions: 7Answers: 0

    Hi, Colin.

    I was able to track down the issue. In my case, calling columns.adjust() caused all rows to re-render (even the ones that are not visible). And since one of the columns had to do some relatively heavy stuff in its render function, I was seeing the described effect.

    Surprisingly, I could not reproduce this in a minimal example (see my attempt here). The rows don't get re-rendered if you press the "Adjust" button at the top.

    For now, I simply removed the heavy code from the render function of the problematic column, and so it no longer causes the huge lag.

  • allanallan Posts: 61,801Questions: 1Answers: 10,115 Site admin

    Thanks for the update. Yes, it is important to keep the rendering function as light as possible since it can be called quite frequently. Good to hear you got to the bottom of it - nice one!

    Allan

Sign In or Register to comment.