Firefoxでの奇妙なjQueryのパフォーマンスの問題を解決する

Question

このページでは、いくつかのフィルタ条件を設定して、フィルタボタンをクリックすると、データが取得されます。

これはすごくうまくいきます。それはうまく戻ってきて、文書の中に入れて、新しいコンテンツに適用されるすべてのホバーとクリックの機能は、大丈夫、素早く素早く反応します。

一度大きなページがあると、フィルタボタンはクリックに反応するのに4〜5秒かかります。

IE 9では、IEの古いバージョンでは、他のものは9より遅くなりますが、予想される/許容可能な速度です。

私はいくつかのプロファイリングなどを行っています。興味深いのは、ボタンがクリックされてから4-5秒後まで、関数の最初のところにconsole.logステートメントが記録されるということです。もっと面白い、私は最初の行として警告を入れれば、それは即座に発火する！後でクリックハンドラにアラートを入れると、アラートが発生する前のすべてが即座に発生しますが、その後のすべてが遅延します。それがクリックされていますことを認識することがdecideds一度

はずっと、ハンドラで起こっているしないように、それは超高速です：

$('#FilterScheduledShifts').click(function() { 

     console.log("Filter Start:" + new Date().getTime()); 

     var categoryId = $('#FilterCategoryId').val(); 
     var activityId = $('#FilterActivityId').val(); 
     console.log("Before GetShiftStatusFilters:" + new Date().getTime()); 
     var shiftStatusFilters = v2GetShiftStatusFilterIds(); 
     console.log("After GetShiftStatusFilters:" + new Date().getTime()); 
     var dayOfWeekFilters = v2GetDayOfWeekFilters(); 
     console.log("After v2GetDayOfWeekFilters:" + new Date().getTime()); 
     var startDateFilter = v2GetStartDateFilter(); 
     console.log("After v2GetStartDateFilter:" + new Date().getTime()); 
     var endDateFilter = v2GetStartEndFilter(); 
     console.log("After v2GetStartEndFilter:" + new Date().getTime()); 

     if (Date.parse(startDateFilter).isBeforeOrEqual(Date.parse(endDateFilter))) { 
      console.log("inside if statement:" + new Date().getTime()); 

      var dataToPost = { categoryId: categoryId, activityId: activityId, statuses: shiftStatusFilters, daysOfWeek: dayOfWeekFilters, startDate: startDateFilter, endDate: endDateFilter }; 
      var url = $('#UrlToFilter').val(); 

      $('#holder').empty().html($('#LoadingScreen').clone()); 
      console.log("after emptyand loadingscreen:" + new Date().getTime()); 
      $.ajax({ 
       url: url, 
       data: dataToPost, 
       type: 'POST', 
       success: function (data) { 
       console.log("success:" + new Date().getTime()); 
        document.getElementById('holder').innerHTML = data; 
        v2WireUpGetUsersForAllShiftsArrow(); 
        v2SetUpGetShiftUserArrow($('#holder').find('div.GetShiftUserArrow')); 
        v2SetUpGetDayShiftsUsers($('#holder').find('div.GetDayUserArrow')); 
        v2SetUpAssingVolunteersLinks($('#holder')); 
       }, 
       error: function() { 
        v2ErrorNotice(v2Text.shared.genericAjaxErrorMessage); 
       } 

      }); 
     } 
     else { 
      v2ErrorNotice('error'); 
     } 
    }); 

    v2SetUpGetShiftUserArrow($('#holder').find('div.GetShiftUserArrow')); 
    v2SetUpGetDayShiftsUsers($('#holder').find('div.GetDayUserArrow')); 

}); 

これらすべてのconsole.logsは、互いの30または40ミリ秒以内に表示されます。だから私はそこには遅いものはないと知っています。

その他の情報：

span.someClass（私は3だと思う）に割り当てられているページ上のカップルのライブのハンドラがあります。以前はもっと長いことがありましたが、私はそれらを修正しました。この問題に大きな違いはありませんでした（一般的にページは良くなっています）。

jqueryはバージョン1.4.1です（いいえ、私は新しいバージョンにアップグレードできません）。

Answer 1

私が気付いたのは、Firebugが開いている場合、特にHTMLタブの場合、DOMの操作や読み込み中に大きなパフォーマンス低下が生じることがあります。ファイヤーバグを閉じて、パフォーマンスが向上するかどうかを確認します。