I am using JQuery with the DataTable plugin, and now I have a big performnce issue on the following line.
aLocalData[jInner] = nTds[j].innerHTML; // jquery.dataTables.js:2220
I have a ajax call, and result string in HTML format. I convert them into HTML nodes, and that part is ok.
var $result = $('<div/>').html(result).find("*:first");
// simlar to $result=$(result) but much more faster in Fx
Then I activate enable the result from a plain table to a sortable datatable. The speed is acceptable in Fx (around 4sec for 900 rows), but unacceptable in IE8 (more then 100 seconds).
I check it deep using the buildin profiler, and found the above single line take all 99.9% of the time, how can I speed it up? anything I missed?
nTrs = oSettings.nTable.getElementsByTagName('tbody')[0].childNodes;
for ( i=0, iLen=nTrs.length ; i<iLen ; i++ )
{
if ( nTrs[i].nodeName == "TR" )
{
iThisIndex = oSettings.aoData.length;
oSettings.aoData.push( {
"nTr": nTrs[i],
"_iId": oSettings.iNextId++,
"_aData": [],
"_anHidden": [],
"_sRowStripe": ''
} );
oSettings.aiDisplayMaster.push( iThisIndex );
aLocalData = oSettings.aoData[iThisIndex]._aData;
nTds = nTrs[i].childNodes;
jInner = 0;
for ( j=0, jLen=nTds.length ; j<jLen ; j++ )
{
if ( nTds[j].nodeName == "TD" )
{
aLocalData[jInner] = nTds[j].innerHTML; // jquery.dataTables.js:2220
jInner++;
}
}
}
}
Try using the YUI DataTable. It is very quick for any large table that I throw it at. You can use it with JQuery without any issues.
For example: http://paulisageek.com/compare/cpu/
I've apply my own patch but still looking for a real solution, it is still very slow in IE (10+ sec) but acceptable.
I read innerHTML once a row and split my own.
// For whom in interest
// Tested on IE8, Fx3.5
.....
aLocalData = oSettings.aoData[iThisIndex]._aData;
jInner = 0;
if(nTrs[i].getElementsByTagName('table').length == 0){
nTds =$.trim(nTrs[i].innerHTML).split(/<\/td>\s*/i);
for(j=0, jLen=nTds.length; j<jLen; j++){
aLocalData[jInner]=nTds[j].replace(/<td[\w\W]*?>/i,'');
jInner++;
}
continue;
}
nTds = nTrs[i].childNodes;
.....
If anyone know why innerHTML are slow, please let me know.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With