Which is faster/better : add data with fnAddData or innerHtml?
Which is faster/better : add data with fnAddData or innerHtml?
orange_roughy
Posts: 19Questions: 0Answers: 0
Hi,
I have about 4000 rows. I'm currently adding them by setting a giant string of s using innerHtml, then calling ("#myTable").dataTable({ ... }). This seems to work fine with Firefox, but on IE8 I get a "script may be causing this page to be slow, blah blah, do you want to cancel the script?"
Would it help if I added rows using fnAddData (after creating the dataTable with no rows)? Any other suggestions?
Thanks,
orange roughy
I have about 4000 rows. I'm currently adding them by setting a giant string of s using innerHtml, then calling ("#myTable").dataTable({ ... }). This seems to work fine with Firefox, but on IE8 I get a "script may be causing this page to be slow, blah blah, do you want to cancel the script?"
Would it help if I added rows using fnAddData (after creating the dataTable with no rows)? Any other suggestions?
Thanks,
orange roughy
This discussion has been closed.
Replies
I'd be happy just getting rid of the "script may be causing problems..." message.
Doing it the way you currently are will almost certainly be the fastest way - fnAddData would just add an extra loop to the mix so wouldn't increase performance in this case.
Typically from what I've seen, 2000 rows is about the point when IE's JS engine gets bogged down, so 4000 rows is certainly going to be pushing it. With Chrome etc you can use many more, but that doesn't help poor old IE. It might be possible to chunk the processing in DataTables (make sure you are using 1.7.5 btw - it has a few improvements specifically for IE) using setTimeouts but you would still have the massive pause for the end user while the processing is going on, and that would require a fair bit of work in DataTables. Is server-side processing an option?
Allan
I've also noticed that if the dataTable is hidden before called $("id").dataTable({...}) the message only rarely appears. Perhaps that is because IE isn't re-rending the DOM, I don't know. But in any case, when I show the dataTable, the column sizes are all messed up. I've tried calling fnAdjustColumnSizing() and fnDraw(), but those don't help.
Server-side processing isn't an option right now. In the future, yes. But in the meantime...I'm using infinite scrolling. Would the use of pagination instead of infinite help?
Thanks,
orange roughy
Odd! I've always found IE to be slower when parsing hidden DOM elements!
> Would the use of pagination instead of infinite help?
No - if you do a profile you'll see that the time is mainly taken up in the sorting function. This is the part which would need to be chunked to stop IE showing the message. The reason I've not got this in DataTables is because the IE message is there for a reason :-) It's a work around for a bigger issue (not what you want to hear I know - sorry). So adding rows with setTimeout I don't believe would help - I think you are simply up against a limitation of the IE browser.
One thing you could try is disabling the sorting classes: http://datatables.net/faqs#speed . That will take off a bunch of stuff that needs done - but it's likely the sorting that is the real problem.
Allan
I've already disabled sorting classes.
I don't understand--earlier you said chunking would help. But now you're saying it won't? In any case, I have the chunking code written & tested. It appears fnAddData() overwrites existing rows instead of appending. The reason I say that is because I call fnAddData() several times, each time with 1000 rows, but final total (after an fnDraw() call) is still only 1000. What am I doing wrong?
> if you do a profile you'll see that the time is mainly taken up in the sorting function
so if i turn off initial sorting, would that help?
I disabled initial sorting (no "aaSorting" option). Still get the message in IE8.
What about the chunking? Why is fnAddData() seemingly overwriting the first 1000 rows with the next?
thanks very much, allan,
orange roughy