IE 8: How To Improve Performance?

tinker1123

I'm using the latest DataTables download.

I've noticed that with IE 8 if my search results return 2000 or more records there is a noticeable lag for IE 8 to render the DataTables CSS, controls, formatting etc. FF and Chrome don't have this problem.

I'm printing the HTML table rows on the page from server side Java processing

Is there anything I can do to improve the performace on IE 8?

allan

Are you using client-side processing with an Ajax data source? If so, enable deferred rendering ( bDeferRender ) and you'll get a large speed increase :-)

Allan

tinker1123

Hi Allan,

No I am not using client side processing with an AJAX source. I am having a server side component print out everything in HTML ( the page, the HTML table tags, the HTML table rows, etc ) and I am using the DataTables library to put it into a horizontally and vertically scrolling table with stationary column names. I'm also paginating

This is what I am doing on my JSP:

[code]
<%@ include file="header.jsp" %>

<!-- this prints tags to the DataTables css file, the JQuery js file and the DataTables js file -->
${css}
${javascript_tag_search2}
${javascript_tag_search3}



$(document).ready(function() {
$('#results_table').dataTable( {
"sScrollY": "${results_table_height}px",
"sScrollX": "600px",
} );
} );








 

ID

NO_PRINT

Full Name
Email Address
Phone Number
Organization



${resultsFromTheSearch}


<!--END: div id="results" -->
[/code]

allan

In which case I think this FAQ probably applies: http://datatables.net/faqs#speed .

2'000 is around the point the we've been finding IE8 can cope with easily. Ajax loading the data will bump it to perhaps 10'000, by which time you want to start considering server-side processing (millions of rows+). IE9 and other modern browsers cope with many more rows than IE8.

Allan

tinker1123

Hi Allan,

Thanks for the feedback. I have some questions about the FAQ entry and you useful answer:

[quote]
Q. DataTables is running slow. How can I speed it up?

A. There are several ways in which you can speed up DataTables. If you are using DOM data, then you can disable the sorting classes (the highlighting column) using bSortClasses. If this isn't enough, then you can use server-side processing, which will work for millions of rows. Additionally, if you are using Firefox, turn off Firebug as this can have a negative impact on performance.
[/quote]

I''l try setting bSortClasses to false tomorrow when I get back to work. My problem is with DataTables doing its initial loading in IE 8 when the user first goes to the page. Will turning off sorting cut down on the work of the initial _loading_ of DataTables?

It looks like server side processing is the safest bet for guaranteeing decent performance. I'm using Java and Spring. I don't know pHp and the example in DataTable docs is in pHp. Is there an example in Java you can point me too?

Thanks in advance for any more tips

Steve

allan

> Will turning off sorting cut down on the work of the initial _loading_ of DataTables?

Yes it will. If you wanted to leave sorting enabled you could set the aaSorting parameter to an empty array (i.e. []) since that will reduce the number of operations that the browser needs to do.

However, that's not what really slows IE down - its the really slow reading of DOM information. If you have 2000 rows, and lets say 5 columns(?), that's 10000 cells it needs to read content from, plus its other DOM interaction. IE8- was always slow a DOM interaction, and this is what kills the performance and why we can get so much more speed when using client-side processing + Ajax source + deferred rendering.

> Is there an example in Java you can point me too?

All the examples I have are here: http://datatables.net/development/server-side/

Allan

tinker1123

Wow, thanks! I will give it a spin.

tinker1123

I've been finding these links helpful in understanding it all:

DataTables example of a server side site up in the client with a pHp server side example
http://datatables.net/release-datatables/examples/data_sources/server_side.html

Blog article about using DataTables with a Java Servlet, useful in that it explains not just the Java but the DataTables API
http://www.codeproject.com/Articles/359750/jQuery-DataTables-in-Java-Web-Applications

A list/glossary of the parameters sent by DataTables to the server side processing and what it expects in return
http://datatables.net/usage/server-side

DataTables server side example, but written in a JSP ( you quoted, most helpful )
http://datatables.net/development/server-side/jsp

Skeleton example of using DataTables with Spring
http://datatables.net/forums/discussion/2456/datatables-spring-mvc-support/p1

Oracle Users: Oracle lacks the keyword "LIMIT" that other dbs have for paging results.
This post shows how to do a workaround. The first few comments to it are also very useful
http://stackoverflow.com/questions/470542/how-do-i-limit-the-number-of-rows-returned-by-an-oracle-query-after-ordering

Jackson users will find this link helpful for debugging the JSON as it shows you how to see the output
http://www.mkyong.com/java/how-to-enable-pretty-print-json-output-jackson/

Lastly, if you are new to DataTables and look just at the server side examples you might not notice that you need to implement the aoColumns variable. Here is an example
https://gist.github.com/1660712

HTH to anyone Googling on a similar problem

Steve

tinker1123

I just finished implementing server side processing for DataTables using Java, JSPs and Spring 3.

Wow, the performance is monumentally better. I'm glad I did this even if Microsoft browser after IE8 get the Javascript performance issue solved.

The speed is just so nice and I feel confident that even if the database grows my site will be able to scale with it as a result.

allan

Excellent stuff - and thanks for posting your findings for others to benefit from them!

Regards,
Allan