Slow when 15,000 records are added to the static table

Slow when 15,000 records are added to the static table

jkathirjkathir Posts: 18Questions: 5Answers: 0

Hi,

I have 15,000 table rows defined in a html file. It takes more time to render 15,000 rows. With pagination it is faster however the export options export only the rows being displayed.

Please kindly help me with a html file with any efficient way to render 15,000 rows and also provide export options to download 15,000 rows as csv, excel, pdf, word, png, copy to clipboard etc.,

Thanks.

This question has an accepted answers - jump to answer

Answers

  • TooManyTablesTooManyTables Posts: 23Questions: 7Answers: 1
    edited August 2017

    If you aren't already, try putting the data into JSON or some other format that can be read via AJAX. If you've got a pre-built 15000 row HTML table that you're calling DataTables on, then I'm not surprised it's taking a while - if I understand it correctly, the browser has to parse the table to display it before it even gets to the point of being able to turn it into a DataTable. That's a fairly large amount of additional overhead when we're talking about 15000 rows.

    The other suggestion is to turn on deferRender, but that will cut out all but rows you've viewed from the Export options, so probably not an option in your case.

  • allanallan Posts: 63,471Questions: 1Answers: 10,467 Site admin

    @TooManyTables is absolutely correct. 15'000 rows is going to take a while to render.

    The deferRender option won't actually have any option until you Ajax load the data, but that is the next step in improving the performance anyway (see the FAQs).

    If the export isn't working for all rows, it suggests that server-side processing might have been enabled, but without a test case, I can't say for sure.

    Allan

  • jkathirjkathir Posts: 18Questions: 5Answers: 0

    If 15,000 rows is a huge data the browser can handle..How does the angular ui grid renders quickly ? I love datatable features and enabling the features with one or 2 lines and love the way it displays...Is anything we miss that has been implemented in angular ui grid?

  • allanallan Posts: 63,471Questions: 1Answers: 10,467 Site admin

    If you post a link to the page in question I'd be happy to take a look at it and tell you how it can be optimised.

    I don't know how Angular UI grid is working, but my guess is that it isn't loading the data from the DOM? I don't know! DataTables can easily handle that meany rows, but fundamentally if you put 15000 rows into the DOM then its going to take a while. That's why the FAQs note that this is the slowest possible option for initialisation of the DataTable.

    Allan

  • jkathirjkathir Posts: 18Questions: 5Answers: 0

    That's correct, Allan.

  • allanallan Posts: 63,471Questions: 1Answers: 10,467 Site admin
    Answer ✓

    You've marked my answer as rejected, but I'm not sure what to add. Reading from the DOM is inherently slow. You'll get a massive performance improvement by using Javascript sourced data.

    Allan

This discussion has been closed.