Die beste performante Methode, um Elemente in ein Array zu schieben?

8

In meiner Website habe ich viele Arrays mit Daten. zum Beispiel: Vertices Array, Colors Array, Größen Array ...

Ich arbeite mit großen Mengen von Gegenständen. Bis zu mehreren zehn Millionen.

Bevor ich die Daten den Arrays hinzufüge, muss ich sie verarbeiten. Bis jetzt habe ich es im Hauptthread gemacht und das hat meine Website für X Sekunden eingefroren. Es erstarrte wegen der Verarbeitung und wegen des Hinzufügens der verarbeiteten Daten zu den Arrays.

Heute habe ich die Verarbeitung zu Web Worker "bewegt" (viel Arbeit geleistet), aber die verarbeiteten Daten werden im Hauptthread hinzugefügt. Ich habe es geschafft, die Freezing-Zeit der Verarbeitung zu speichern, aber nicht des Addierens.

Das Hinzufügen erfolgt einfach durch array.push() oder array.splice() .

Ich habe einige Artikel darüber gelesen, wie Array funktioniert, und herausgefunden, wenn wir ein Element zu einem Array hinzufügen, wird das Array vollständig an einen neuen Platz im Speicher mit array.length + 1 size kopiert und dort addiert. Dadurch werden meine Daten langsam.

Ich habe auch gelesen, dass typisierte Arrays viel schneller sind. Aber dazu müsste ich die Größe des Arrays kennen, die ich nicht kenne, und für die Erstellung eines großen typisierten Arrays mit extra Zähler und Verwalten von Hinzufügungen in der Mitte (und nicht am Ende des Arrays) wäre a Viele Codeänderungen, die ich jetzt nicht machen möchte.

Also, für meine Frage, Ich habe TypeArray, die von der Web-Worker zurückgeben, und das muss ich in regelmäßigen Array. Was ist der beste Weg, um es zu tun? (Heute laufe ich in einer Schleife und schiebe nacheinander)

BEARBEITEN

Beispiel für die Funktionsweise der Website: Der Client addiert die Anzahl der Elemente, sagen wir 100000. Die Rohdaten der Elemente werden gesammelt und an den Arbeiter gesendet. Der Arbeiter verarbeitet alle Informationen und sendet die verarbeiteten Daten als typisiertes Array (zur Verwendung als übertragbare Objekte) zurück. Im Hauptthread fügen wir die verarbeiteten Daten zu Arrays hinzu - bis zum Ende oder in einem bestimmten Index. 2. Runde. Der Client fügt weitere 100000 Elemente hinzu. Senden an den Worker und das Ergebnis wird den Haupt-Thread-Arrays hinzugefügt. 3. Runde kann 10 Punkte sein, 4. Runde 10000, 5. Runde kann Indizes 10-2000 entfernen, ...

    
Raziza O 12.05.2015, 11:05
quelle

1 Antwort

5

Hat etwas mehr Forschung mit den Kommentaren und über eine andere Richtung nachgedacht.

Ich habe versucht, typedArray.set Methode zu verwenden und festgestellt, dass es sehr, sehr schnell ist.

10 Millionen Elemente mit Sets benötigten 0,004 Sekunden, verglichen mit array.push 0,866 Sekunden. Ich habe die 10 Millionen in 10 Arrays aufgeteilt, um sicherzustellen, dass die set-Methode beim Start von Index 0 nicht schneller arbeitet.

Auf diese Weise würde ich meinen eigenen insertAtIndex sogar mit dem TypedArray implementieren, der alle Elemente nach vorne verschiebt und die neuen \ s im richtigen Index einstellt.

Zusätzlich kann ich TypedArray.subArray verwenden, um meine Subdaten entsprechend der tatsächlichen Datenmenge im Array zu holen (die die Daten nicht kopiert) - nützlich für das Hochladen der Daten in den Puffer (WebGL)

Ich sagte, ich möchte mit regelmäßigen Arrays arbeiten, aber diese Leistungssteigerung würde ich nicht als weise empfinden. Und es ist nicht so viel Arbeit, wenn ich MyNewTypedArray als TypedArray mit allen push , splice , eigene Implementierung umschließt.

Ich hoffe, diese Info hat jedem geholfen

%Vor% %Vor%
    
Raziza O 12.05.2015, 14:14
quelle