Estoy trabajando en un sitio web de intranet donde hay mucha interacción con la página principal. El sitio usa jQuery ampliamente. Así que pensé en almacenar en caché las selecciones de jQuery la primera vez que se solicitan y extraerlas de la caché para cada solicitud posterior. (También he incorporado una anulación si quiero forzar una re-selección).

Aquí está el fragmento básico de código sobre el que me pregunto:

( function(window, $, undefined) {
  var mp = {};
  mp.cache = [];
  mp.get = function ( selector, force) {
    return ( !force || !mp.cache[ selector ] )  /*separating for readability */
           ? mp.cache[ selector ] = $( selector ) 
           : mp.cache[ selector ];
  }

  /* more functions and code */

  window.mp = mp;
  window.$$ = mp.get;

})(window, jQuery);

Se usaría como una selección normal de jQuery, pero verifica si ese selector ya existe en la matriz cache y, si es así, solo devuelve los resultados desde allí.

EJEMPLO ACTUALIZADO

$('#mainmenu').on('click','.menuitem', highlightSelectedMenuItem );

function highlightSelectedMenuItem () {
  var menuitems = $$('.menuitem'); //selected first time, from cache every other time
  menuitems.find('.current').removeClass('current');
  $(this).addClass('current');
}    

Hay alrededor de 20-30 selecciones diferentes en el código. Por lo tanto, cada uno se almacenaría en caché en la primera llamada. Este código solo se ejecutará en clientes de escritorio (sin teléfonos / tabletas).

¿Buena idea? ¿Algún problema que esto pueda causar? ¿Hay una buena manera de probar si esto ayuda / perjudica el rendimiento? Cualquier pros / contras que se te ocurran serán apreciadas.

Avíseme si necesita más información.
Aquí hay un violín para "tocar el violín".

¡Gracias!

3
Gary Storey 29 ago. 2014 a las 00:00

3 respuestas

La mejor respuesta

Hice su pregunta en un jsperf, y descubrí que jQuery sin caché parece ejecutarse más rápido.

http://jsperf.com/jquery-cache-array-test

Debido a esto, recomendaría simplemente usar jQuery puro.

1
howderek 28 ago. 2014 a las 20:16

Creo que es una mala idea. Si necesita usar una selección en varios lugares, guarde la selección en una variable. var mySelection = $ (# myId).

Será basura recolectada cuando ya no sea necesaria.

0
Steve Farwell 28 ago. 2014 a las 20:35

En pocas palabras: probablemente una mala idea.

Estás introduciendo una complejidad que probablemente sea innecesaria y que probablemente solo va a consumir memoria.

Si está intentando acelerar las selecciones que se repiten, almacene la selección en una variable. Cuando ya no sea necesario, el recolector de basura lo eliminará. Para el 99% de las aplicaciones disponibles, eso es todo el almacenamiento en caché que necesita.

Un gran problema con su ejemplo es que los elementos que ha seleccionado se mantendrán indefinidamente. Piense en las personas que pueden trabajar en este código más adelante. Todos pueden comenzar a usar $$('....') porque lo ven en unos pocos lugares y hace lo mismo que $('....'). De repente, está almacenando miles de elementos DOM en la memoria sin ningún motivo.

Más allá de eso, si el DOM cambia y no sabes que está cambiando, el código que tienes en la memoria caché es inútil ... pero a menos que lo obligues a recargar, terminarás obteniendo ese código almacenado en caché. Lo que, por supuesto, introduce errores. Para evitar que eso suceda, tendrías que forzar la recarga de la memoria caché constantemente, lo que prácticamente niega su utilidad.

Será mejor que siga patrones de programación buenos y sólidos que ya están disponibles ... en lugar de programar un mecanismo de almacenamiento en caché que será un imán de error.

3
Stephen 28 ago. 2014 a las 20:22