Ich habe eine for-Schleife, die mehr als 10.000 Mal in einem JavaScript-Code iteriert. Die for-Schleife erstellt und fügt & lt; div & gt; Tags in einer Box in der aktuellen Seite DOM.
%Vor%Ich möchte eine Verzögerung nach jeder 50 & lt; div & gt; Tags, was wird der Code an der Stelle von
sein %Vor%weil es zu viel Zeit braucht, um alle 10.000 & lt; div & gt; Stichworte. Ich möchte die Box in Chunks von 50 & lt; div & gt; Tags.
Danke im Voraus.
In diesen Situationen gibt es einen praktischen Trick: Verwenden Sie ein setTimeout mit 0 Millisekunden. Dies führt dazu, dass Ihr JavaScript dem Browser zur Verfügung steht (so dass es das Rendering ausführen, auf Benutzereingaben reagieren kann usw.), ohne es jedoch zu zwingen, eine gewisse Zeit zu warten:
%Vor% Hinweis : T.J. Crowder erwähnt unten korrekt, dass der obige Code in jeder Iteration der Schleife unnötige Funktionen erzeugt (eine zum Einrichten der Schließung und eine andere als Argument zu setTimeout ). Dies ist wahrscheinlich kein Problem, aber wenn Sie möchten, können Sie seine Alternative ausprobieren, die nur einmal die Closure-Funktion erstellt.
Ein Wort der Warnung: Obwohl der obige Code eine angenehmere Wiedergabeerfahrung bietet, ist es nicht ratsam, 10000 Tags auf einer Seite zu haben. Jede andere DOM-Manipulation wird danach langsamer sein, weil es viel mehr Elemente zu durchlaufen gibt, und eine viel teurere Reflow-Berechnung für irgendwelche Änderungen am Layout.
Sie können die Funktion window.setTimeout verwenden, um die Ausführung von Code zu verzögern:
> %Vor%Aber Ihr Javascript wird weiterhin ausgeführt. Es wird nicht aufhören.
Ich würde den Code, der div s erzeugt, in eine Funktion aufteilen und dann die Ausführung dieser Funktion periodisch über setTimeout wie folgt planen:
Dies verwendet einen einzelnen Abschluss, doAChunk , um die Arbeit zu erledigen. Diese Schließung ist für die Garbage Collection geeignet, sobald ihre Arbeit abgeschlossen ist. (Mehr dazu: Verschlüsse sind nicht kompliziert )
es dauert viel Zeit, weil das Reflow-Verfahren. Sie sollten ein Dokumentfragment erstellen und dann die Gören hinzufügen.
Wann findet das Reflow in einer DOM-Umgebung statt?
Javascript-Leistung - Dom Reflow - Google-Artikel
Schlafen wird Ihr Problem nicht lösen
andererseits erstellen Sie einen String, der den inneren Schein und den Zusatz zu inneren Schein enthält. Das String-Zeug braucht keine große Leistung, aber wenn Sie den .innerhtml -Befehl ausführen, startet es einen Prozess, der Ihre Zeichenkette analysiert und Elemente erstellt und anhängt. Sie können eine Verzögerung nicht unterbrechen oder hinzufügen.
Der Vorgang internhtml kann nicht unterbrochen oder unterbrochen werden.
Sie müssen die Elemente einzeln generieren und nach 50 hinzugefügten Elementen eine settimeout-Verzögerung erstellen.
%Vor%Hier ist der wahre Trick, um eine Verzögerung in Javascript zu setzen, ohne den Browser zu hängen. Sie müssen eine Ajax-Funktion mit synchroner Methode verwenden, die eine PHP-Seite aufruft, und auf dieser PHP-Seite können Sie die php-Funktion sleep () verwenden! Ссылка
Tags und Links javascript javascript-framework