Performance Issues with IE8 + DeferRender + Ajax - Part 1

layda7

Hi,

I have search and read through the forums about IE8 performance issues but still managed to run into it with DeferRender and AJAX; so here goes:
My data is currently approximately somewhere between 300 rows - 1800 rows x 27 columns; However, since I am using DeferRender, there is approximately 24 - 25 rows x 27 columns visible in a single view in any given time. In addition, I also noticed that the page size is reduced considerably (from 3 - 6 MB to 120 KB). DataTable is doing a fantastic job in keeping the page size small.

The issue is that on first load, data row of 600 rows x 27 columns, there seems to be quite a lot of processing on the client side that it causes the browser to freeze - a good 15+ seconds on IE8. Basically, running into the same issues as I was when doing server side. Please also note that the table contains HyperLinks, Clickable Text (Span) and some Text and Cell formatting.

I've copied my settings below; I do apologise as I have to mask the column names as they are quite sensitive.

aoColumn:
[code]
var cols = [
{ "mDataProp": "col1" },
{ "mDataProp": "col2", "bVisible": false, "bSearchable": false },
{ "mDataProp": "col3", "sClass": "pointer" },
{ "mDataProp": "col4", "bVisible": false, "bSearchable": false },
{ "mDataProp": "col5", "sClass": "pointer" },
{ "mDataProp": "col6", "bSearchable": false },
{ "mDataProp": "col7", "bVisible": false, "bSearchable": false },
{ "mDataProp": "col8", "bSearchable": false },
{ "mDataProp": "col9", "bVisible": false, "bSearchable": false },
{ "mDataProp": "col10", "sClass": "pointer", "bSearchable": false },
{ "mDataProp": "col11", "bSearchable": false},
{ "mDataProp": "col12", "bSearchable": false, "bVisible": (viewOne == "0" ) ? false : true },
{ "mDataProp": "col13", "bSearchable": false },
{ "mDataProp": "col14", "bSearchable": false, "bVisible": (viewOne == "0") ? false : true },
{ "mDataProp": "col15", "bSearchable": false },
{ "mDataProp": "col16", "bSearchable": false },
{ "mDataProp": "col17", "bSearchable": false },
{ "mDataProp": "col18", "bSearchable": false },
{ "mDataProp": "col19", "bSearchable": false },
{ "mDataProp": "col20", "bSearchable": false },
{ "mDataProp": "col21", "bSearchable": false },
{ "mDataProp": "co22", "bSearchable": false },
{ "mDataProp": "col23", "bSearchable": false },
{ "mDataProp": "col24", "bSearchable": false, "sClass": "NumericValue" },
{ "mDataProp": "col25", "bSearchable": false, "bVisible": (viewOne == "0") ? false : true },
{ "mDataProp": "col26", "bSearchable": false, "sClass": "NumericValue" },
{ "mDataProp": "col27", "bSearchable": false, "bVisible" : false },
{ "mDataProp": "col28", "bSearchable": false }
]
[/code]

Part 2 to Follow.

- Daniel

Rypens

I'm having the same issues in IE8... The data loads pretty fast, but when init completes, and i start scrolling or clicking. The browser freezes.
If you get to fix this... please let me know.

jaspreetsingh

@ Daniel

You need to use Server Side Processing , that will only load single page, when you are requesting a data.


Thanks
Jaspreet Singh

Rypens

My last comment can help as well...
http://www.datatables.net/forums/discussion/10334/data-loads-quickly-in-ie8-but-browser-chokes-on-scrolling#Item_5