Gibt es eine Möglichkeit, diese Lösung für Groß- und Kleinschreibung jQuery zu beschleunigen: enthält Selektor?
-
05-07-2019 - |
Frage
Ich fand diese Lösung Groß- und Kleinschreibung Wähler jQuery :contains
auf Stackoverflow. Es funktioniert großartig, jedoch kommt es auf Kosten der Leistung. Hat jemand diese Lösung findet etwas langsam sein?
Ich bin mit dem :contains
Selektor eine Tabelle zu suchen. Der Benutzer tippt einen Suchbegriff in eine Textbox. Für jeden Tastendruck, sucht es die Tabelle für diesen String, zeigt nur die Zeilen, die die Zeichenfolge über den :contains
Selektor enthalten. Bevor Sie die Groß- und Kleinschreibung Lösung implementieren, war diese Suche schnell und bissig. Jetzt mit dieser Lösung, sperrt es nach jedem Tastendruck für einen kurzen Moment auf.
Alle Ideen, wie diese Lösung beschleunigt werden könnte?
Lösung
fand ich eine andere Lösung der Groß- und Kleinschreibung Suche bei Google (siehe Eric Phan ), die geringfügig von der variiert ich ursprünglich mit.
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 die erstere ist, was wirklich die Leistung der Groß- und Kleinschreibung Suche verbessert. Ändern Sie einfach die ursprüngliche Lösung (a.textContent || a.innerText || "")
statt jQuery(a).text()
zu verwenden, den Unterschied gemacht!
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.
Schließlich Dank an alle, die geantwortet haben. Ich appreicate Ihre Hilfe. =)
Andere Tipps
Sie könnten versuchen, die Wähler nur einmal zu überprüfen, nachdem der Benutzer die Eingabe für eine bestimmte Zeit angehalten 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
}
}();
Sie könnten versuchen, nicht nach jedem Tastendruck überprüft, aber vielleicht eine Sekunde nach dem letzten Tastendruck gedrückt wurde. Auf diese Weise Sie nicht ständig überprüft, während der Benutzer eingeben, sondern überprüft, wenn der Benutzer fertig ist oder pausiert Typisierung.
hier ist eine Follow-up-Frage: Was ist das Geschäft mit jQuery.text ()? Warum ist es so langsam?
Ich vermute, dass es aufgrund der $(a)
(Umwandlung des DOM-Elements auf ein jQuery-Objekt) langsam ist und nicht die .text()
.
, um hinzuzufügen, was jason gesagt hat, können Sie versuchen, eine href mit <= "http://notetodogself.blogspot.com/2008/12/jquery-responsiveness-plugin-for-fast.html" rel = "nofollow noreferrer "> dieses Plugin das erreichen.