Dart canvas performance

Question

This problem is related to my VilTAGE map ( https://github.com/ViliX64/VilTAGE ). This is an ASCII web platform that displays Canvas. The problem is that the drawing time is two times longer than the calculation time.

The rendering method now is that there is a HashMap of each CharNode (an object with a text symbol, color, etc.) and a CanvasElement that has the text drawn on it. When the loop wants to draw a CharNode (15-30x per second), it goes through the HashMap, finds the required CanvasElement and maps it to the main CanvasElement. (See https://github.com/ViliX64/VilTAGE/blob/master/lib/etc/utility.dart ).

Individual CanvasElement bindings are small (usually around 10x10). They are drawn using drawImage (..);

The problem is that in a game with 70x40 CharNodes, the game runs (not surprisingly) very slowly and even more when compiled in JavaScript.

Is there some obvious mistake I am making, or could you give me any tips for improving performance?

EDIT 1: It works slower on Firefox and IE. Performance on Google Chrome is better.

Answer 1

, javascript, , , , CanvasElement drawImage , . .

imageData getImageData putImageData ( CanvasRenderingContext2D)