Ich habe mit dem HTML5-Canvas herumgespielt und mir ist etwas aufgefallen, für das ich keine Online-Lösung finden konnte. Hier ist der einfache Code, mit dem ich spiele
%Vor%Jedes Mal, wenn ich auf Draw drücke, scheint die Geschwindigkeit, mit der es ausgeführt wird, exponentiell zu verlangsamen. Könnte jemand wissen, warum das passiert?
Es wird am meisten durch IE verlangsamt. Chrome scheint es mit jedem Draw-Klick schneller zu machen, aber Sie können immer noch eine Geschwindigkeitsreduzierung feststellen.
Das Element <canvas> verfolgt einen aktuellen Pfad (d. h. eine Menge von Punkten, Linien und Kurven). canvas.moveTo , canvas.lineTo und canvas.stroke arbeiten alle auf dem aktuellen Pfad. Jedes Mal, wenn Sie canvas.moveTo oder canvas.lineTo aufrufen, fügen Sie den aktuellen Pfad hinzu. Da der Pfad immer komplexer wird, wird das Zeichnen immer langsamer.
Sie können den Pfad löschen, indem Sie canvas.beginPath() aufrufen. Wenn Sie dies zu Beginn Ihrer Zeichenfunktion tun, sollte die Verlangsamung beseitigt werden.