En Aza jQuery örneği fazla örneğini

Question

oluşturma vs ben posts on javascript/jQuery optimization bir dizi başladı ve bu ilginç sonucu tökezledi.

Neden (önbelleğe alınmış jQuery koleksiyonundan arayarak) jQuery nesneleri minimize jQuery nesneleri fazla örneğini oluşturarak daha sonra yavaş olabilir ki?

I hazırlanan bir test sonuçlarını görmek sersemlemişti. Her zaman $ örnekleri oluşturmanın en aza indirilmesinin daha yavaş olduğunu düşündüm.

Bu şimdiye ebeveyn (i "AppRoot" diyoruz) önbelleğe olarak i yazmaya alışkınım budur.

var appRoot = $("#appRoot"); 
    appRoot.find(".element1").css("color","red"); 
    appRoot.find(".element2").css("color","blue"); 

$(".element1").css("color","red"); 
    $(".element2").css("color","blue"); 

karşı test sonuçları (biraz farklı bir senaryo) bakınız. jsperf minimize-jquery-object-creation, önbelleğe alınan snippet'in daha sonra önbelleğe alınmamış snippet'in daha yavaş olduğu ortaya çıkıyor.

Nedenini anlamaya çalışıyorum?

Answer 1

:

İşte belgeyi ikinci kaçak bu aralık ile biraz yakın gözüküyor AppRoot olarak kullanarak başka testtir. İlk örnekte olduğu gibi kod yazmanın nedeni, seçiciyi daha hızlı yapmak, ancak ek yöntem çağrıları yapmaktır. Normalde, seçmen ikiden çok daha pahalı olmalı, bu yüzden kazanım kayıptan daha ağır basacaktır, fakat DOM ile bu küçük seçici, nasıl yazdığınızın önemi olmadan çok ucuz olacaktır.

İnsanlar genelde daha karmaşık ve büyük DOM kodunun darboğazları değişeceğini hatırlamak değil misstake olun. Bence jsperf bunun hakkında bir çeşit uyarıda bulunmalı.

Answer 2

Sanırım find() çağrısı yavaşlayan şeyler.

bir jQuery nesne önbelleğe tek nedeni referans göstererek veya ona defalarca manipüle edilecek gidiyoruz olduğunu. Bir CSS mülkü oluşturuyorsanız ve söz konusu mülkün işlenen sayfanın ömrü boyunca değiştirilmemesi durumunda, bir önbellek değişkeni tanımlamak için bir neden yoktur.

Answer 3

Ben jQuery "daha az jquery" diğer durumda son API

document.getElementsByClassName("classvalue") 

doğrudan yararlanabilirler "daha jquery nesneleri oluşturulan" çünkü düşünüyorum hep doğrulamak zorunda bulunan öğe #appRoot altındadır ve bu da daha fazla zaman alır. Eğer testi 10'dan az div'leri veya diğer html elemanları içerdiğini dikkate almak gerekir http://jsperf.com/minimize-jquery-object-creation/6