Gibt es eine Möglichkeit, diese Lösung für eine Groß-und Kleinschreibung jQuery zu beschleunigen: contains selector?

Question

Ich fand this solution für eine Groß-und Kleinschreibung jQuery :contains Selector auf StackOverflow. Es funktioniert großartig, jedoch auf Kosten der Leistung. Hat jemand andere diese Lösung als etwas langsam empfunden?

Ich verwende den :contains Selektor, um eine Tabelle zu suchen. Der Benutzer gibt eine Suchzeichenfolge in ein Textfeld ein. Bei jedem Tastendruck wird die Tabelle nach dieser Zeichenfolge durchsucht, wobei nur die Zeilen angezeigt werden, die diese Zeichenfolge über den Selektor :contains enthalten. Vor der Implementierung der case-insensitive Lösung war diese Suche schnell und bissig. Jetzt mit dieser Lösung, es schließt für einen kurzen Moment nach jedem Tastendruck ab.

Irgendwelche Ideen, wie diese Lösung beschleunigt werden könnte?

Answer 1

ich eine andere Lösung der Groß- und Kleinschreibung Suche bei Google gefunden (siehe Eric Phan), das unterscheidet sich geringfügig von dem, den ich ursprünglich verwendet habe.

Original:

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

EricPhan:

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

Vergleich der beiden, können Sie Eric Phan-Lösung sehen greift die DOM-Attribute direkt und verwendet toLowerCase() statt toUpperCase(). Letzteres ist nicht wirklich wichtig, aber erstere hat die Leistung der Suche ohne Berücksichtigung der Groß-/Kleinschreibung verbessert. Nur die ursprüngliche Lösung zu ändern, um (a.textContent || a.innerText || "") anstelle von jQuery(a).text() zu verwenden, machte den Unterschied!

Jetzt bin ich ein bisschen neugierig, also hier ist eine Follow-up-Frage: Was ist der Deal mit jQuery.text()? Warum ist es so langsam? Ich habe meine Vermutungen, aber ich würde gerne hören, was die Experten zu sagen haben.

Zuletzt, danke an alle, die geantwortet haben. Ich appreate deine Hilfe. =)

Answer 2

Sie könnten versuchen, nicht nach jedem Tastendruck zu überprüfen, aber vielleicht eine Sekunde nach dem letzten Tastendruck wurde gedrückt. Auf diese Weise überprüfen Sie nicht ständig, während der Benutzer tippt, sondern prüfen, ob der Benutzer fertig ist oder die Eingabe pausiert.

Answer 3

Um hinzuzufügen, was Jason gesagt hat, können Sie versuchen, this plugin zu verwenden, um das zu erreichen.

Answer 4

Sie könnten versuchen, den Selektor nur einmal zu überprüfen, nachdem der Benutzer die Eingabe für eine bestimmte Zeit beendet hat, nicht für jeden Tastendruck.

Zum Beispiel eine einfache Implementierung:

Verbrauch:

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

Umsetzung:

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 5

hier ist eine Follow-up-Frage: Was ist der Deal mit jQuery.text()? Warum ist es so langsam?

Ich vermute, dass es aufgrund der $(a) (Umwandlung des DOM-Element auf ein jQuery-Objekt) und nicht die .text() langsam ist.