1

60 秒ごとに継続的に動的にリロードするテーブルがあります。これにより、データが最新の状態に保たれます。私はここからスクリプトを使用しています - http://www.michaelfretz.com/2010/04/21/using-ajax-to-load-data-from-php-into-your-website/

約 15 件のレコードがあるページでは、Twitter Bootstrap のツールチップは問題なく機能し、高速で見栄えがします。

ただし、別のページには400を超えるレコードがあります。各レコードには、そのレコードに関するデータベースからの情報を示すホバー ツールチップがあります。すでにタイトルタグに情報が出力されているのですが、ホバリングすると表示されるまでに1秒以上かかり、ページ全体の動きが鈍く見えます。

この理由は、「Rel」タグと、ライブ (継続的に更新) である Twitter JavaScript を使用しているためであると考えているため、速度が低下します。確信はないけど。

これを修正する方法はありますか.....または、[次へ]をクリックするたびに次のページをロードするページ分割されたテーブルを作成することをお勧めしますか?

4

2 に答える 2

2

400 レコードは、誰かが 60 秒以内にトラバースすると予想するには多すぎます。実際の html を実際に見ないと、提案を行うのは少し難しいですが、ここに 3 つを示します。

  • 代わりに title 属性を使用してください。Title 属性についてを参照してください。これは、ツールチップの Bootstrap レンダリングではなく、組み込みのブラウザー コードを使用していることを意味します。
  • 件名だけでなく、行ごとに件名/コンテンツのスニペットを表示します。つまり、コンテンツの最初の部分を実際の件名の後の利用可能なスペースに配置します。最近ではほとんどの人が大型モニターを使用しており、レスポンシブ デザインを使用すると、件名の後に多くのコンテンツを表示できます。
  • あなたが言うように、ページネーションを使用してください。ブートストラップはそれを提供しますが、配線を行う必要があります。
于 2012-12-10T06:32:34.380 に答える
0

400レコード！過度に！

これは、ブラウザとシステムのパフォーマンスに大きく関係しています。で 400 件のレコードを表示するのlive()はちょっとクレイジーです。ブラウザは確実にクラッシュします。代わりにできることは 1 つです。pagination小さなサブセットのみを使用して表示します。また、ユーザーはナビゲートや検索が困難になります。

もう 1 つの方法は、datatablesを使用することです。table何も心配する必要はありません。残りはデータテーブルが処理します。ページネーションと検索は、この点で優れた機能です。

データテーブルのスクリーンショット:

データテーブルのスクリーンショット
(ソース: webresourcesdepot.com )

これが表示された場合、検索、並べ替え、ツールチップの提供などのすべてが、最小限のデータ セットでクライアント側で行われます。そのため、ブラウザのペイロードは少なくなり、ユーザーは必要なだけの部分を見ることができます。

于 2012-12-10T06:47:59.787 に答える