¿Cuándo se considera $ .cache demasiado grande?

He leído recientemente en this tutorial que ciertas fugas de jQuery se pueden rastrear a través de la variable $.cache, y siempre debes verificar su tamaño, si es demasiado grande, estás haciendo algo mal.

Bueno, ¿qué tan grande es demasiado grande? ¿Hay alguna manera de inspeccionar una variable para ver cuánta memoria está consumiendo?

Estoy trabajando en un sitio web que almacena en caché 210 objetos solo cargando la página de inicio. ¿Es eso demasiado? Agradecería una explicación exhaustiva sobre el tema aquí.

Fuente

2012-10-10 ChuckE

No se trata de lo grande que es, pero la forma en que crece con el tiempo. Si la memoria caché no está limitada (es decir, aumenta para siempre), es probable que tenga una pérdida de memoria. –

jQuery es verdaderamente compatible con el navegador. Trae el problema de IE de disponer correctamente de los elementos a todos los navegadores. –

Sería difícil presionar para tensar las capacidades de la memoria moderna si es sensato. A menos, por supuesto, que cree una fuga de memoria lo suficientemente grande. No hay una cantidad mágica de memoria, todo depende del hardware del usuario. ¿Te importa que las personas usen computadoras de los 90? –

$.cache El tamaño en el valor nominal no dice nada acerca de las pérdidas de memoria. Puede ser muy pequeño y aún tener una pérdida de memoria, o podría ser muy grande y no tener ninguna pérdida de memoria.

Si sabe que tiene 10 oyentes de eventos enlazados con jQuery en la página a la vez, y sin embargo $.cache tiene entradas para más, entonces usted sabe que tiene una fuga.

Un gran ahorro de memoria consiste en utilizar la delegación de eventos en lugar de asociar los detectores de eventos a cada elemento individual.

Di:

<ul> 
    <li></li> 
    <li></li> 
    <li></li> 
</ul>

$("li").on("click", fn) uniría 3 controladores de eventos individuales (más, si tiene más de Li, por supuesto), mientras que $("ul").on("click", "li", fn) se conecte sólo uno independientemente del número de li-elementos que tiene y todavía tienen el mismo resultado

Ejemplo de fuga:

$("button").click(function() { 
    $("#target")[0].innerHTML = ""; 
    $("<div>").appendTo($("#target")).click($.noop); 
    $("#log").text(Object.keys($.cache).length); 
});

http://jsfiddle.net/SGZW4/1/

razón es que .innerHTML se utiliza, que no es parte de jQuery por lo que no pueden hacer limpiar.

Fix es utilizar el método de jQuery para el mismo:

$("button").click(function() { 
    $("#target").html(""); 
    $("<div>").appendTo($("#target")).click($.noop); 
    $("#log").text(Object.keys($.cache).length); 
});

http://jsfiddle.net/SGZW4/2/

Fuente

2012-10-10 12:50:57 Esailija

eso es un buen consejo. pero ¿cómo puedo usar la variable $ .cache para inspeccionar mejor el uso de mi memoria? Un ejemplo en el que pensé: verifique el número de elementos en la memoria caché, haga clic en un botón y tenga un comportamiento visual esperado, verifique el número de elementos almacenados en la memoria caché, haga clic en el botón que restablece la acción anterior y vea si el número de elementos es el mismo que al comienzo de esta prueba. ¿Es esto, por ejemplo, un buen uso de $ .cache para probar el uso de la memoria? – ChuckE

@ChuckE No me preocuparía $ .cache, una manera de evitar todo es utilizar exclusivamente la delegación de eventos para elementos estáticos que nunca se eliminan en primer lugar. De lo contrario, solo asegúrese de estar siempre utilizando los métodos jQuery, y no los DOM estándar: http://jsfiddle.net/SGZW4/1/ vs http://jsfiddle.net/SGZW4/2/ – Esailija

humm, interesante. Entonces, eso significa que, para el caso probado, $ .cache ni siquiera puede verificar si hubo una pérdida de memoria. – ChuckE

¿Cuándo se considera $ .cache demasiado grande?

Respuesta

Cuestiones relacionadas