私は、FirefoxとChromeでうまく機能するjqueryデータテーブルを持っていますが、IE7ではかなり遅いです。データテーブル バージョン 1.7.6 を使用しています。
以下は、9 列のテーブルです。
this.dataTable = $('#sar-requests-table').dataTable({
"aaSorting": [[ 4, "desc" ]],
"aoColumnDefs": [{
"fnRender": function ( row ) {
return renderWorkOrderIdTableCell(row.aData[0]);
},
"aTargets": [0]
}],
"bProcessing": true,
"bJQueryUI": true,
"oLanguage": {
"sSearch": "Filter:"
}
});
fnReloadAjax プラグインを呼び出すと、速度が低下します。
this.dataTable.fnReloadAjax("/api/sar/?_=" + Math.random() + "&" + query);
この呼び出しは、Java EE アプリに対してクエリを実行し、最大 5000 レコードを取得します。プラグインをデバッグし、時間がかかる場所をピンで留めました。
$.fn.dataTableExt.oApi.fnReloadAjax = function ( oSettings, sNewSource, fnCallback,bStandingRedraw)
{
if ( typeof sNewSource != 'undefined' && sNewSource != null )
{
oSettings.sAjaxSource = sNewSource;
}
this.oApi._fnProcessingDisplay( oSettings, true );
var that = this;
var iStart = oSettings._iDisplayStart;
console.log('STEP 1 '+new Date());
oSettings.fnServerData( oSettings.sAjaxSource, null, function(json) {
/* Clear the old information from the table */
that.oApi._fnClearTable( oSettings );
console.log('STEP 2 '+new Date());
/* Got the data - add it to the table */
for ( var i=0 ; i<json.aaData.length ; i++ )
{
that.oApi._fnAddData( oSettings, json.aaData[i] );
}
console.log('STEP 3 '+new Date());
oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
that.fnDraw( that );
console.log('STEP 4 '+new Date());
if ( typeof bStandingRedraw != 'undefined' && bStandingRedraw === true )
{
oSettings._iDisplayStart = iStart;
that.fnDraw( false );
}
console.log('STEP 5 '+new Date());
that.oApi._fnProcessingDisplay( oSettings, false );
/* Callback user function - for event handlers etc */
if ( typeof fnCallback == 'function' && fnCallback != null )
{
fnCallback( json );
}
console.log('STEP 6 '+new Date());
} );
}
ほとんどの時間は (STEP2 と STEP3) と (STEP3 と STEP4) の間に費やされ、合計で 30 秒 (5000 レコードの場合) です。つまり、以下のブロックは 15 秒かかります。
for ( var i=0 ; i<json.aaData.length ; i++ )
{
that.oApi._fnAddData( oSettings, json.aaData[i] );
}
以下のものはさらに15秒かかります:
oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
that.fnDraw( that );
これらのブロックはどちらも 1 秒もかかりません。テーブルの並べ替えとセルレンダリングを削除しようとしましたが、役に立ちませんでした。「bpaginate:false」を配置すると、パフォーマンスが向上しますが、5000 レコードのオプションではありません。
アドバイスをいただければ幸いです。
編集:バージョン 1.8.0 と 1.9.1 を使用してみましたが、どれも役に立ちませんでした。