Ich schreibe eine Funktion, die ein Bild Pixel für Pixel auf ein Canvas-Element zeichnet. Ich bemerkte, dass es einen Punkt gab, an dem die Funktion plötzlich viel länger dauerte als zuvor - speziell von einer 338x338 Pixel großen Leinwand auf eine 339x339 Pixel große Leinwand.
Wenn ich eine ähnlich aussehende Funktion in die Hand lege, bekomme ich dasselbe Ergebnis. Die While-Loop-Verarbeitung eines Arrays von 338x338 dauert ca. 6-7 Sekunden, während ein Array von 339x339 ca. 24-25 Sekunden.
Dies geschieht in Chrome. In Firefox dauert beide ca. 16 Sekunden.
Hier ist die Geige: Ссылка
Der Code sieht so aus:
%Vor%Ist dies ein Speicherproblem mit Javascript in Chrome, oder mache ich etwas falsch mit den Objekten? Gibt es eine Möglichkeit, diese höhere Verarbeitungsdauer zu vermeiden?
Überlegen Sie sich, was Ihre SPLICE-Operation eigentlich macht. Lassen Sie uns durch Spleißen dieses Array durchlaufen:
[0,1,2,3,4,5]
Ich müsste:
%Vor%das sind 12 Operationen (auf einem Array, das 6 Elemente groß ist) ... Ihre Arrays sind viel, viel größer (über 100k Elemente) ... und Sie durchlaufen diese, indem Sie sie nach unten ziehen. Ich mache das ungefähr 26 Milliarden Berechnungen, die Sie in Ihrem Code anfordern !!!
Ich habe Ihren Code überarbeitet, um die while-Schleife in den Test zu integrieren und NICHT die SPLICE-Funktion zu verwenden - Ich erhalte jetzt die Tests auf meinem Computer auf 23ms und 25ms (das gleiche Ergebnis wie die Tests) ... Ihr Beispiel nahm 3599ms und 19464ms - das ist fast 500-mal effizienter:)
Sie haben viele andere Probleme mit diesem Code, aber das bringt Sie zu Ihrem größten Problem!
%Vor%Tags und Links javascript optimization