Html Dart中的画布性能
这个问题与我的框架VilTAGE（）有关。这是一个ASCII网络游戏框架，可以渲染到画布。问题是，绘图时间是计算时间的两倍 现在渲染的工作方式是，每个CharNode（一个对象，具有文本字符、颜色等）和CanvasElement都有一个HashMap，其中包含绘制在其上的文本。当循环想要绘制一个CharNode（每秒15-30倍）时，它会遍历HashMap，找到所需的CanvasElement并将其渲染到主CanvasElement。（见附件） 单个画布元素捕捉很小（通常约为10x10）。它们是使用drawImage（..）绘制的 问题是，在一个有70x40个CharNodes的游戏中，当编译成JavaScript时，游戏运行（令人惊讶）非常慢，甚至更慢 我有没有犯过什么明显的错误，或者你能给我一些提高绩效的建议吗Html Dart中的画布性能,html,performance,canvas,dart,Html,Performance,Canvas,Dart,这个问题与我的框架VilTAGE（）有关。这是一个ASCII网络游戏框架，可以渲染到画布。问题是，绘图时间是计算时间的两倍 现在渲染的工作方式是，每个CharNode（一个对象，具有文本字符、颜色等）和CanvasElement都有一个HashMap，其中包含绘制在其上的文本。当循环想要绘制一个CharNode（每秒15-30倍）时，它会遍历HashMap，找到所需的CanvasElement并将其渲染到主CanvasElement。（见附件） 单个画布元素捕捉很小（通常约为10x10）。它们是
编辑1：它在Firefox和IE上运行最慢。在Google Chrome上的性能更好。如果它像在javascript中一样工作，你的问题可能是你正在缓存一个CanvasElement，每次调用它时drawImage都必须从中检索bitmapData。这是一个非常昂贵的手术
您可以尝试使用getImageData缓存imageData并使用putImageData绘制它（这两种方法都是CanvasRenderingContext2D方法）感谢您的提示。我将在10分钟内返回结果。好的，我已经更新了代码，现在我只缓存ImageData。它确实提高了性能，但只提高了一点点（平均每秒2帧）。编辑后的代码可以在这里找到：好吧，看来我错了，抱歉搞混了：我认为它实际上对速度有点影响。由于VilTAGE正在绘制许多微小的图像，因此无法将测试与此进行比较。您正在通过hashmap进行循环，而不是按照应该使用的键直接获取。改变这个应该会给你一个小的加速。我知道，但我需要的值是相同的。即使在重写==运算符时，它也没有返回所需的CharNode。不过，谢谢你的提示。我已经更新了代码，所以它不再遍历hashmap了。它确实提高了Firefox和IE上的性能：）很可能在重写==时忘记重写。您是否尝试过使用chrome或IE的分析器来查看哪些函数占用了大部分CPU时间？