Keytable makes application sluggish

jattDaLann

Dear All,

I've got a big table (2.5 thousand rows) with data and works alright performance wise, but when adding keytable to the datatable, it goes very sluggish, any solution to this?

[code]
var oTable = $("#userdealsPlayerSummary table").dataTable({
"aaSorting": [[6, "desc"]],
"bProcessing": true,
"iDisplayLength": 50,
"sPaginationType": "full_numbers",
"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]]
});

var keys = new KeyTable({
"table": document.getElementById('userdealsTable'),
"datatable": oTable
});
[/code]

allan

It might perhaps need some optimisation work done in KeyTable, I've never tried it in a table as large as 2500 rows, so I don't have any first hand experience of what the performance is like - but I'd suggest running Firebug's profiler to see what might be taking up the time. If you can post a link to an example I can take a look.

Allan

TiredJake

I ran into the same thing and I have a fix that hopefully Allan can roll into an update. I had about 1,800 rows and Initializing the click event took an average of 6,219 ms in Chrome 7 and 57,853 ms (almost a minute!) in Firefox 3.6. With my fix, they both take 1 ms. This fix requires jQuery 1.4.2 or newer.

Search for ".click" in KeyTable.js and replace the existing if (_oDatatable ) block with the code below:

[code]
if ( _oDatatable )
{
/* original code
jQuery('td', _oDatatable.fnGetNodes()).click( _fnClick );

replacement code by Randy Brandt - tiredjake.com
requires jQuery 1.4.2 or newer
*/
jQuery(_oDatatable).delegate('td', 'click', function(event)
{
_fnSetFocus( this );
_fnCaptureKeys();
});

}
else
{
// original jQuery('td', _nBody).click( _fnClick );

jQuery(_nBody).delegate('td', 'click', function(event)
{
_fnSetFocus( this );
_fnCaptureKeys();
});
}
[/code]