¿Hay alguna forma de acelerar esta solución para un jQuery insensible a mayúsculas y minúsculas: contiene selector?

Question

Encontré esta solución para un jQuery que no distingue entre mayúsculas y minúsculas: contiene el selector en StackOverflow. Funciona muy bien, sin embargo, viene a costa del rendimiento. ¿Alguien más encuentra esta solución un poco lenta?

Estoy usando el selector : contiene para buscar una tabla. El usuario escribe una cadena de búsqueda en un cuadro de texto. Para cada pulsación de tecla, busca en la tabla esa cadena, mostrando solo las filas que contienen esa cadena a través del selector : contiene . Antes de implementar la solución que no distingue entre mayúsculas y minúsculas, esta búsqueda fue rápida y ágil. Ahora, con esta solución, se bloquea por un breve momento después de cada pulsación de tecla.

¿Alguna idea sobre cómo podría acelerarse esta solución?

Answer 1

Encontré otra solución de la búsqueda que no distingue entre mayúsculas y minúsculas en Google (consulte Eric Phan ) que varía ligeramente de la que estaba usando originalmente.

Original:

return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0;

EricPhan:

return (a.textContent || a.innerText || "").toLowerCase().indexOf(m[3].toLowerCase())>=0;

Comparando los dos, puede ver que la solución de Eric Phan accede directamente a los atributos de DOM y usa toLowerCase () en lugar de toUpperCase () . Lo último no importa realmente, pero lo primero es lo que realmente mejoró el rendimiento de la búsqueda sin distinción de mayúsculas. Simplemente cambiando la solución original para usar (a.textContent || a.innerText || " ") en lugar de jQuery (a) .text () hizo todo el ¡diferencia!

Ahora estoy un poco curioso, así que aquí hay una pregunta de seguimiento: ¿Cuál es el problema con jQuery.text () ? ¿Por qué es tan lento? Tengo mis suposiciones, pero me encantaría escuchar lo que dicen los expertos.

Por último, gracias a todos los que respondieron. Aprecio tu ayuda. =)

Answer 2

Puede intentar comprobar el selector solo una vez, después de que el usuario haya dejado de escribir durante un período de tiempo específico, no por cada pulsación de tecla.

Por ejemplo, una implementación simple:

Uso:

$("#textboxId").keyup(function () {
  typewatch(function () {
    // executed only 500 ms after the user stopped typing.
  }, 500);

Implementación:

var typewatch = function(){
    var timer = 0;  // store the timer id
    return function(callback, ms){
        clearTimeout (timer);  // if the function is called before the timeout
        timer = setTimeout(callback, ms); // clear the timer and start it over
    }  
}();

Answer 3

podría intentar no verificar después de cada pulsación de tecla, pero tal vez un segundo después de presionar la última pulsación de tecla. de esta manera, no está comprobando constantemente mientras el usuario está escribiendo, sino que está comprobando cuándo el usuario ha terminado o haciendo una pausa en la escritura.

Answer 4

  

He aquí una pregunta de seguimiento: ¿Qué   El trato con jQuery.text ()? Por que es   tan lento?

Sospecho que es lento debido al $ (a) (convertir el elemento DOM a un objeto jQuery) y no al .text () .

Answer 5

Para agregar a lo que jason ha dicho, puedes intentar usar este complemento para lograrlo.