鏈式jQuery對象在什麼條件下提供性能提升？

我正在使用一些代碼來添加和刪除同一對象上的各種CSS類。代碼看起來是這樣的：鏈式jQuery對象在什麼條件下提供性能提升？

function switch_states(object_to_change) { 
    if(object_to_change.hasClass('ready') { 
    object_to_change.removeClass('ready'); 
    object_to_change.addClass('not_ready'); 
    } else { 
    object_to_change.removeClass('not_ready'); 
    object_to_change.addClass('ready'); 
    } 
}

我懷疑我也許可以用這兩種snippits鏈接到類似object_to_change.removeClass('ready').addClass('not_ready');離開，但我不得不懷疑：除了易讀性和NEATO因素，這確實給我任何的性能提升？

我的問題：鏈接的對象會比兩個非鏈接的對象快嗎？如果是這樣，爲什麼？如果沒有，使用鏈接對象的效率會高於不同的效率 - 也就是說，鏈式jQuery對象在什麼條件下提供性能提升？

來源

2010-12-07 buley

會一連鎖目標做好本職工作的任何速度比兩個非連鎖的呢？如果是這樣，爲什麼？

鏈接對象以選擇器開始時速度更快，並且鏈接可防止選擇器多次針對DOM運行（相對昂貴的操作）。

較慢：

$(".myClass").val(123); 
$(".myClass").addClass("newClass");

更快：

$(".myClass") 
    .val(123) 
    .addClass("newClass");

緩存在變量中選擇器具有同樣的好處鏈（即防止昂貴DOM查找）：

var $selctor = $(".myClass"); 
$selector.val(123); 
$selector.addClass("newClass");

來源

2010-12-07 15:49:19 Andy

這裏沒有性能提升：它是同一個對象。只是neato因素，這不應該被低估。

來源

2010-12-07 15:45:32

@drachenstern - 再次。你不知道你在說什麼。 – 2010-12-07 15:58:42

嗯？我不同意：他已經選擇了jquery對象並連續使用它兩次。 – 2010-12-07 16:00:55

在你的例子中，答案是否定的。然而，鏈接的作用是讓你能夠在而不是聲明變量的地方，在這些地方你可以使用鏈（和當前的元素堆棧）來執行各種任務。

我會推薦使用鏈接換行符 - 這已成爲一種jQuery約定。

來源

2010-12-07 15:46:44

@drachenstern - 你看他的例子嗎？他有一個緩存的jQuery變量。我的回答是正確的。沒有選擇器在運行。 – 2010-12-07 15:56:41

好了，你不能真正鏈中的if()聲明，但jQuery有一個toggleClass()方法似乎是適當的位置：

object_to_change.toggleClass('ready not_ready');

這消除了鏈接VS擺在首位單獨調用的需要。我不知道它在性能方面的表現。需要測試。

編輯：我要指出，上述方案意味着對象已有一個或另一個。如果不是，另一種方法是將函數傳遞給toggleClass。

object_to_remove.toggleClass(function(i, cls) { 
    return cls.indexOf('ready') == -1 ? 'ready' : 'ready not_ready'; 
});

來源

2010-12-07 15:48:05 user113716

的性能增益最明顯的是開發和維護。如果代碼乾淨，可讀，意圖明顯 - 開發人員的時間應該減少。

雖然這需要與代碼性能進行平衡，但如果存在經過測試的可測量差異，則需要優化速度。如果可能的話，不要降低代碼的可讀性。

如果代碼的可讀性/可維護性會影響，請查看優化是否可以作爲構建過程的一部分自動執行，以保留可維護代碼以供進一步開發。

來源

2010-12-07 16:07:44

鏈式jQuery對象在什麼條件下提供性能提升？

回答

相關問題