Sé que debe almacenar en caché los resultados de un selector si lo usa más de una vez. Un ejemplo sería:
var $selected = $('.some-selected-element');
process($selected);
doStuff($selected);
Pero ¿hay alguna mejora en el rendimiento de la memoria caché $(this) si se utiliza varias veces?
$('.some-selector').hover(function() {
if (!$(this).hasClass('some-other-class')) {
$(this).addClass('another-class');
}
process($(this));
}
Sí, hay un aumento en el rendimiento, ya que evita que jQuery tenga que interpretar el selector.
Aquí está la interpretación de un selector, y lo que estará pasando por alto. https://github.com/jquery/jquery/blob/master/src/core.js#L78-188
En esencia, esta parte
if (selector.nodeType) {
this.context = this[0] = selector;
this.length = 1;
return this;
}
Sí, hay ventajas de rendimiento.
El almacenamiento en caché el resultado de $(this) evita múltiples llamadas a la función $() y la creación de varios objetos diferentes jQuery que todos se refieren al mismo elemento.
La función $() encuentra el nodo DOM para el elemento y aplica los métodos prototipados a él para los navegadores que aún no los agregan cuando están definidos (navegadores IE). Entonces, llamarlo constantemente realizará esta operación. Es mejor para el rendimiento y la legibilidad almacenar en caché el resultado de la llamada a la función $() a una variable.
jsperf.com es un gran recurso - y uno que he tomado a frecuentar los últimos tiempos - para evaluar el rendimiento de JavaScript. Por ejemplo, la siguiente prueba evalúa el rendimiento de los elementos de jQuery en caché a la de sin almacenamiento en caché:
http://jsperf.com/jquery-cache-vs-no-cache
Los resultados eco de las respuestas en este hilo.
sí, debe hacer una llamada a una función y devolver el resultado varias veces – xandercoded