提高基於jQuery的搜索的速度

Question

我想提高基於JQuery的搜索的速度，我已經實現了here。此搜索在具有以下規格的客戶端計算機上速度非常慢。 Intel Dual Core Processor 2.0 GHz與2 GB RAM。

的搜索代碼是這樣的：

function applyFilter(evt) { 
    if (!evt) evt = e.which; 

    if (evt.keyCode == 13) 
     return false; 

    $('table#tblTestRequest tr').css('display', 'none'); 
    $('table#tblTestRequest tr:first').css('display', ''); 
    var tbFilterVal = $('#txtFilter').val().toLowerCase(); 
    filter($('table#tblTestRequest tr:has(span)'), tbFilterVal); 
    $('#txtFilter').focus(); 
    evt.cancelBubble = true; 
} 

function filter(selector, query) { 
    query = $.trim(query); //trim white space 
    query = query.replace(/ /gi, '|'); //add OR for regex query 

    $(selector).each(function() { 
     ($(this).text().search(new RegExp(query, "i")) < 0) ? $(this).css('display', 'none') : $(this).css('display', ''); 
    }); 
} 

請你告訴我，我能做些什麼來提高搜索的速度。用戶通常必須按一個鍵，然後等待幾秒鐘以過濾下面的記錄...

Answer 1

您不需要爲每個對象創建RegExp對象。只需爲您的查詢創建一個RegExp對象，並在每個對象的文本上使用test方法。這也將消除與0進行比較的需要。我不知道這些優化是否足夠，但它應該有所幫助。

本質上講，你更換線路：

$(selector).each(function() { 
     ($(this).text().search(new RegExp(query, "i")) < 0) ? $(this).css('display', 'none') : $(this).css('display', ''); 
    }); 

與

var pat = new RegExp(query, "i"); 
$(selector).each(function() { 
     (pat.test($(this).text()) ? $(this).css('display', '') : $(this).css('display','none'); 
    }); 

也就是說，如果我沒犯了一個錯誤，因爲這些線路沒有經過測試。