Auf einer Webseite habe ich eine ziemlich große Liste von Gegenständen (z. B. Produktkarten, jede enthält Bild und Text) - etwa 1000 davon. Ich möchte diese Liste auf dem Client filtern (nur die Elemente, die nicht herausgefiltert wurden, sollten angezeigt werden), aber es liegt ein Problem mit der Renderleistung vor. Ich wende einen sehr engen Filter an und es verbleiben nur noch 10-20 Elemente. Dann wird der Filter abgebrochen (alle Elemente müssen erneut angezeigt werden) und der Browser (Chrome auf einem sehr schönen Computer) legt ein oder zwei Sekunden lang auf.

Ich rendere die Liste mit folgender Routine neu:

<code>for (var i = 0, l = this.entries.length; i < l; i++) {
    $(this.cls_prefix + this.entries[i].id).css("display", this.entries[i].id in dict ? "block" : "none")
}
</code>

dict ist der Hash der IDs der zulässigen Elemente

Diese Funktion selbst wird sofort ausgeführt, das Rendern hängt. Gibt es eine optimalere Methode zum erneuten Rendern als das Ändern der "Anzeige" -Eigenschaft von DOM-Elementen?

Vielen Dank für Ihre Antworten im Voraus.