1

クライアント側にキャッシュしたいページ分割されたデータのテーブルがあり、ページを最も効率的に切り替える方法を見つけようとしています。

したほうがよいでしょうか:

A. DOM を 1 回変更することで、テーブルを再構築して置き換える

var pageLength = 50;
var cache; //array of some objects from database

function changePage(index) {
    var $table = $("<table>");
    $.each(cache, function (i, row) {
        var $tr = $("<tr>");
        if (i < index || i > index + pageLength) $tr.hide();
        $tr.append($("<td>", { text: row.ID }));
        $tr.append($("<td>", { text: row.Name }));
        $table.append($tr);
    });
    $("#targetDiv").html($table);
}

また

B. DOM に挿入した後の行の表示と非表示

function changePage(index) {
    var $table = $("#targetDiv table");
    $table.find("tr:visible").hide();
    $table.find("tr").each(function (i, row) {
        if (i > index && i < index + pageLength) $tr.show();
    });
}

最初の行に沿って何かを書き、Chrome と IE8 で実行したところ、IE は非常に著しく遅いことがわかりましたが、Chrome では問題はありませんでした。残念ながら、私たちの標準はまだ IE7 です。そのため、IE7 の JS エンジンが IE8 よりもパフォーマンスが悪い可能性がある場合に備えて、最適化を試みています。

4

1 に答える 1

0

私は両方の組み合わせを行います。

ロードすると、ページ 1 が表示されます (どこかに保存されている完全なリストへの参照付き)。

ページ 2 が要求されたら、ページ 2 のデータを入力してページ 1 を非表示にします。

別の機会にページ 2 が要求されると、すでに入力されているため、非表示/表示機能になります。

これは、現在のページ、存在する可能性のあるページ数などを認識しているクラスによって処理されるのが最善です。次に、現在のページから特定のページ数だけ離れたページを空にできるスマートなメモリ管理を行うことができます。 .

ただし、既存のソリューションを使用することをお勧めします

多くのクライアント側ページング プラグインがあり、特に jQuery 用です。

私は既存のソリューションを使用し、ここで車輪を再発明しようとはしません.

于 2013-03-20T20:19:50.153 に答える