jquery - 大量のデータで Jquery ui タブが遅くなる

Question

jQuery UI タブ レイアウトを使用しているときに、HTML の量が多いタブをいくつか開いていることに気付きました。次に、タブ間のウィッチングが少し遅くなります。タブラベルをクリックすると、タブが開くまでにたとえば2〜4秒かかります。それは事実であり、タブに長いテキストを表示したい場合は変更できませんが、タブを開く前に読み込みインジケータを表示する方法はありますか?

Answer 1

私のコードではなく、jQueryフォーラムからのものです:

https://forum.jquery.com/topic/switching-tabs-slow-with-big-content

コードは次のとおりです。

http://jsfiddle.net/7npbK/1/

 $("#tabs").tabs({
      beforeActivate: function () {
          // alert("switching");
          $("#loadingDiv").fadeIn('slow');
      },
      activate: function () {
          //alert("switched");
          $("#loadingDiv").fadeOut('slow');
      }
  });

基本的には、jQuery UI タブのbeforeActivateおよびactivateイベントを利用します。ただし、根本的な原因は解決されません。jQuery タブは CSS の表示/非表示を使用し、多数の DOM 要素を使用すると、UI の応答が遅くなります。