Performance IE8: both ajax source and server side processing (both have bDeferRender enabled)

rgvcorley

Just had some fun reading the discussions in the forums that the bDeferRender feature was born out of!

I've got a couple of my tables that almost completely lock up the entire page when rendered in IE8, one is Ajax source, the other server side. Both use bDeferRender: true.

The table takes about 8 seconds to render and then any filtering/sorting takes at least 10 seconds. Other things on the page are also slow - for example a plain CSS rollover (not in the table) takes over a second to change!

Here is the debug info for the server side table:-
http://debug.datatables.net/igaqor

Any ideas?

p.s. I have another table which is identical initialization as the ajax source one but only has a single row and it renders fine.

allan

Thanks for the debugger trace - it says you are using server-side processing, so in fact deferred rendering is irrelevant here! Deferred rendering means that TR nodes which are not needed will not be drawn, but server-side processing is effectively already doing that, since for each draw you are making a request to the server and DataTables only draws the rows that the server returns information about.

So given that only 200 rows are being drawn per page, my first thought is, how long does your Ajax request take to get a reply to? The 'Network' tab in Webkit's Inspector is really handy for looking at that kind of thing.

Regards,
Allan

rgvcorley

I'm having the same problem with my Ajax source table (which actually uses deferRender ;) ) the ajax calls are 300ms and 700ms each. It's not just the initial time to render - the whole page grinds to a halt in IE8...

Could be an interaction with another script on the page - I'll have a bit more of a play, try disabling some of the other scripts/and or DT features and see if I can narrow down the issue

allan

I wonder if it might be worth running a profiler on the page - it does sound like something is hammering it. Certainly DataTables shouldn't be doing anything that causes a CSS hover to take a full second to show on the page!

Allan

rgvcorley

It's my resize function... again!

Why are such simple things in CSS like a layout that fills the viewport near impossible to get to work cross browser without many hundreds of hours of fiddling around with all the stupid idiosyncrasies of M*soft 's Sh*ty browsers

Oh well - there goes another chunk of my life - Mircrosoft should have outsourced their browser development to Mozilla.

allan

Ah - bummer. Have you got the debounce function in? Perhaps if you turn the timeout to something like 500mS that would help?

Allan

rgvcorley

I've tried setting the timeout to 1000ms, no difference! I'm not sure why this would slow the whole page down though, because surely if the window isn't being resized then the resize event shouldn't be being triggered?

Once I do get this working I'm going to write it as a plugin and put it on the web somewhere so that anyone else wanting a table stretched to fill some element doesn't have to go through the same pain!

allan

Yes - sorry - I had assumed that it was while it was being resized. IE fires a 'resize' event for almost anything, which will be part of the problem, but I suspect it might be a case of needing to add debug to the page to find out what is being called, and then look at the console to see how often it is being called.

I'm not sure if IE8 has a profiler available, but if so, that would be very useful to see what is happening.

Allan

rgvcorley

Here are 2 profiles from IE8, this one is for sorting on a column (Which isn't as slow as quoted before but the numbers I quoted before were for my laptop (because I wanted to run IE8 natively), these are run on my desktop which is a much faster machine):-

http://corley.co/IE8%20Profile%20for%20sorting%20on%20a%20column.csv

However despite the sorting being quicker the page still slows to a halt, see the profile below for opening one of the modal forms, it takes nearly 6 seconds!

http://corley.co/IE8_Profile%20for%20opening%20modal%20form.csv

allan

Thanks for the csv files. They show that the majority of the time is spent in jQuery's get method, which is interesting. The profiler doesn't happen to have a way of showing which function it is that is calling get?

Out of interest, if you disable infinite scrolling in DataTables, does that improve the situation at all? And what about if you comment out the call to fnAdjustColumnSizing?

6 seconds really is horrifically slow!

Allan

rgvcorley

The profiler does have that facility but when you export it flattens the tree. Here's a couple of screen prints for the dialog opening and table sorting:-

http://corley.co/sort.gif
http://corley.co/dialog.gif

This is with no calls to fnAdjustColumnSizing and infinite scrolling disabled.

I've just had another play and setting the buffer time to 2 seconds speeds things up a lot - for now I've just stuck in a conditional setting just for IE8 - I know that's band practice but I've got far too much still to do to fiddle with this one any longer!

So it must have been IE's over jealous resize events as you originally suggested!

Thankyou very much for your help with this one!