Speed up the data table load on the client side

test-dev

Hello,

I'm using datatables with 2K records and it takes around 15s to draw the table. I load the data using XMLHttpRequest to load all the data at once (this doesn't take very long because it is only 2K records) and then I draw the table using HTML(this takes longer).Then I also do some rendering. I show the records on pages of 10 records each.

I do not want to do server side processing. I there anything that I can do on the client side to speed it up ?

Thank you.

rf1234

You could try this
https://datatables.net/reference/option/deferRender

test-dev

Hi @rf1234 thank you for the comment. I already tried it, but it doesn't change anything. I think it is because, as I said in the post, I draw the table using HTML and not ajax.

test-dev

Hi @rf1234 you were right it did help, but I had to change the way I draw the table before I used to do in html and now I pass the data as data source:

$('#example').dataTable( {
"data": [
[ "Tiger Nixon", "System Architect", "$3,120", "2011/04/25", "Edinburgh", 5421 ],
[ "Garrett Winters", "Director", "$8,422", "2011/07/25", "Edinburgh", 8422 ],
// ...
]
} );

Now I'm down to 3.3s. And 1.7s of those is spend scripting. And 340 ms rendering. Is there anything else I can do on client side ?

Thank you very much.

rf1234

@test-dev, not sure what else you could do. But maybe @allan has an idea?!

I personally use Data Tables with Editor only and I have no issues with large tables.

Without server side and without deferRender it takes 1.54 seconds to display a table with over 12,000 rows.Since this is only an internal admin table I keep it that way. Server side may cause complications with filtering because it searches fields the way they are stored in the data base which may be very different from the rendered fields. And deferRender may also have some downsides when filtering but I forgot which (I guess you find it in the description).

test-dev

@rf1234 I do not do any filtering on the server. I just send I a list of json with all the data inside.

rf1234

Then it is really amazing that this is so slow. Have you ever tried using Editor? Might be worth a try. The license is fairly inexpensive and you can use it for so many things. I built a pretty large financial services platform using Data Tables and Editor on every page.

kthorngren

Maybe you can post your Datatable init code so we can get an idea of what you are doing.

Kevin