2010-12-21 7 views
5
personas

Todos hemos visto que hacen esto:¿Cuál es el desperdicio más común de potencia informática en Javascript?

jQuery('a').each(function(){ 
    jQuery(this)[0].innerHTML += ' proccessed'; 
}); 

function letsPoluteNS() { 
    polute = ''; 
    for (morePolution = 0; morePolution < arguments.length; morePolution++) 
     polute.join(arguments[morePolution]); 
    return polute; 
} 

y así sucesivamente. Me preguntaba qué personas han visto la técnica más común de JavaScript/jQuery que está ralentizando la página y/o perdiendo tiempo para el motor de JavaScript.

Sé que esta pregunta no parece encajar en una pregunta aceptada, pero me pregunto "¿cuál es el residuo aceptado más común?"

+1

¿Cómo juzgas "los residuos aceptados más comunes"? –

Respuesta

3

Soy culpable de esto. Básicamente utilizando solo la clase del elemento en un selector jQuery. En lugar de combinar el selector de clase con el nombre de etiqueta de elementos.

<div></div> 
<div class="hide"></div> 
<div class="show"></div> 
<div class="hide"></div> 
<div class="hide again"></div> 

$(".hide").hide(); 

En lugar de la más rápida

$("div.hide").hide() 


También este es ineficiente, muchas personas no hacen uso del parámetro de contexto para los selectores

$(selector, [ context ])


$("#mydiv").click(function() { 
     $("#mydiv span").show(); 
    } 

que puede ser manejado mejor así:

$("#mydiv").click(function() { 
     $("span", this).show(); 
    } 
+4

¿Qué? '# hello' es definitivamente el más rápido (' document.getElementById() 'no obstante). – BoltClock

+0

sí getElementById es mucho más rápido que {getElementByClassname-> getElementById}, incluso sin la sobrecarga – qwertymk

+0

'$ (" # hello ")' es esencialmente lo mismo que 'getElementById ('hello');' que es una forma muy eficiente de obtener un elemento dom. Agregar un nombre de etiqueta adicional al selector no ayuda. –

1

Cualquier cosa que tenga que ver con el seguimiento de usuarios y gran publicidad. Eso es espacio perdido con seguridad.

Supongo que el uso incorrecto de cosas como usar clases en lugar de identificadores como selector en html muy complejo ralentizaría la tarea. Y ie por supuesto.

+4

aquí: 'for (z = 0; z <1000; z ++) {showUglyPopupAd()}' – JCOC611

+0

@ JCOC611 ¡Exactamente! – Iznogood

+0

puede hacerlo aún más lento cambiándolo a z> 1000 – travelboy

0

Calling $ .animate a animar elementos deben hacer las cosas más despacio.

1

También verá esto:

$('#this').find('a').doSomeThing(); 

Saber lo que es mucho más eficiente? Un selector que cubra a ambos te servirá mejor ...

$('#this a').doSomeThing(); 

Parece obvio, pero lo verás todo el tiempo.

+0

En realidad, no es cierto. El primero es más rápido, ya que delega directamente en 'document.getElementById()' para restringir la búsqueda hacia abajo. –

+0

Entonces, ¿buclear sobre el conjunto seleccionado es más eficiente? Siempre entendí que un solo selector es el método preferido. –

+0

Depende. Las cosas que pueden ser manejadas directamente por el navegador siempre son más rápidas. El ejemplo más claro es 'getElementById()', pero si el navegador admite 'getElementsByName',' getElementsByTagName' o 'querySelectorAll', entonces será más rápido suministrar un selector que pueda ser manejado directamente por esas funciones y filtrar los resultados usando jQuery métodos. –

0

no declarando sus vars del getgo para que estén en caché, sin usar cierres y repitiendo x número de la misma función/call/etc pero solo cambiando ID o clase para cada uno, usando eval().

Cuestiones relacionadas