¿Hay una diferencia de rendimiento entre el selector jquery o una variable

Últimamente me he estado preguntando si hay una diferencia de rendimiento entre repetir el selector una y otra vez o simplemente usar una var y almacenar el selector en eso y solo referirme a él .¿Hay una diferencia de rendimiento entre el selector jquery o una variable

$('#Element').dothis(); 

$('#Element').dothat(); 

$('#Element').find('a').dothat();

o simplemente

var Object = $('#Element'); 

Object.dothis(); 

Object.dothat(); 

$('a', Object).dothat();

Yo prefiero la segunda forma porque se ve más limpio y es mejor mantener.

Fuente

2009-10-22 Baijs

La segunda forma es probablemente más rápida ya que no está escaneando el índice DOM cada vez para los objetos requeridos. Además, como dices, es una mejor práctica de codificación, siempre y cuando los nuevos nombres de las variables reflejen adecuadamente lo que contienen. –

también, para recordar que era un objeto jQuery, puede usar $ object pero es lo mismo, pero siempre conoce los objetos js y los objetos relacionados con jquery. – Sinan

Sin duda hay una diferencia de rendimiento, ya que sizzle no tiene que ejecutarse cada vez, sin embargo, también hay una diferencia de funcionalidad. Si el valor dom cambia entre la primera y la tercera llamada, el objeto jQuery almacenado en caché todavía contendrá el conjunto anterior de elementos. Esto a menudo puede ocurrir si almacena en caché un conjunto y luego lo utiliza en una devolución de llamada.

Fuente

2009-10-22 10:20:23

¿Alguna idea sobre cómo evitar eso? Es decir, para almacenar el selector en una variable pero ¿tiene en cuenta un DOM cambiante? Todo lo que puedo pensar es almacenar una función que devuelva el selector en la variable (pero no parece funcionar para mí) – donnovan9

Invalidar una selección puede ser realmente difícil, y nadie lo hace debido a los navegadores antiguos y las condiciones de carrera. La mejor manera de hacerlo, si está escribiendo todo el código que cambia su dom, agregue los elementos a las colecciones usted mismo cada vez que realice un cambio. Entonces, si insertas algo para lo que sabes que tienes una colección, haz un '$ mycollection.add (newNode);' –

Prefiero la segunda manera. Será más fácil de mantener el código incluso si cambia una identificación o clase de elemento.

Fuente

2009-10-22 10:17:59 rahul

+1 para "código más fácil de mantener" – smack0007

Hay otra manera rápida. Es tan rápido como su segundo código.

$('#Element') 
    .dothis() 
    .dothat() 
    .find('a') 
     .dothat();

Fuente

2009-10-22 10:20:56 jantimon

La segunda forma tiene un beneficio de rendimiento. Puede o no ser genial, pero es mejor. En la primera versión, que está haciendo el recorrido dom 4 veces, en el segundo sólo haces 2.

Bastante bueno el artículo relativo a la aceleración jQuery aquí: http://net.tutsplus.com/tutorials/javascript-ajax/10-ways-to-instantly-increase-your-jquery-performance/

Fuente

2009-10-22 10:21:46 smack0007

gastar en el método de Ghommey

var Object = $('#Element'); 

Object 
    .dothis() 
    .dothat() 
    .find('a') 
     .dothat();

Más rápido, y almacena el objeto para su uso posterior.

Fuente

2009-10-22 10:23:33 dotty

Almacenar los resultados de su selección jQuery a una variable es más rápido. Esto se debe a que jQuery no necesita buscar los resultados cada vez que intenta acceder a ellos.

junté algunos parámetros de rendimiento: http://jsperf.com/jquery-selectors-vs-stored-variable

En Chrome 26.0.1410.63 en Mac OS X 10.8.2:
Selección: 40,276 ops/seg
Almacenamiento de la variable: 594,031,358 ops/seg

Fuente

2013-04-10 16:40:28 calvintennant

¿Hay una diferencia de rendimiento entre el selector jquery o una variable

Respuesta

Cuestiones relacionadas