1. ホーム
  2. ジャバスクリプト

[解決済み】数百万行のJavaScriptデータグリッド【終了しました

2022-04-06 19:52:06

質問

<余談
クローズド . この質問は 意見型 . 現在、回答は受け付けておりません。

<パス

この質問を改善したいですか? 事実と引用で答えられるように、質問を更新する。 本論文の編集 .

クローズド 7年前 .

JavaScriptを使って、大量のデータ行(つまり数百万行)をグリッドでユーザーに表示する必要があります。

ユーザーは、ページを見たり、一度に有限のデータしか見れないのでは困る。

むしろ、すべてのデータが利用可能であるように見えるはずです。

データを一度にダウンロードするのではなく、ユーザーが(グリッドをスクロールするなどして)必要なデータに到達した時点で、小さなチャンクをダウンロードするようにしました。

このフロントエンドでは行を編集することはできないので、読み取り専用のグリッドも許容されます。

このようなシームレスなページングを実現する、JavaScriptで書かれたデータグリッドにはどのようなものがあるでしょうか?

解決方法は?

( 免責事項:私はSlickGridの作者です。 )

アップデイト に実装されました。 SlickGrid .

ご覧ください http://github.com/mleibman/SlickGrid/issues#issue/22 は、SlickGridをより多くの行で動作させるための進行中の議論です。

問題は、SlickGridがスクロールバー自体を仮想化していないことです。スクロール可能な領域の高さは、すべての行の高さの合計に設定されています。 ユーザーがスクロールしている間、行の追加と削除は行われますが、スクロール自体はブラウザによって行われます。 そのため、非常に高速でありながらスムーズな動作が可能です(onscrollイベントの動作が遅いのは有名です)。 注意点は、ブラウザのCSSエンジンにバグや制限があり、要素の高さが制限されることです。 IEの場合、これは0x123456または1193046ピクセルになります。 他のブラウザの場合は、もっと高くなります。

実験的な回避策が "largenum-fix" ブランチにあり、高さ 1M ピクセルに設定した "pages" でスクロール可能な領域を構成し、それらのページ内で相対位置決めを使用することによってこの限界を大幅に引き上げることができます。 CSS エンジンの高さ制限は実際のレイアウト エンジンと異なり、かなり低いようなので、これによって上限がかなり高くなります。

現在、SlickGridが他の実装に対して持っているパフォーマンスの優位性を失うことなく、行数を無制限にする方法を探しています。

Rudigerさん、どのように解決したのか、詳しく教えてください。