Canvas tag - drawarc vs image

我已经实现了一个使用drawarc创建气泡效果的背景上以各种速度上升的画布元素（它是一个以水下为主题的客户端的水下主题网站） - 它看起来非常真实很好，我对它很满意，但是我注意到在某些浏览器（特别是IE9）中出现了轻微的性能问题。Canvas tag - drawarc vs image

我正在使用drawarc绘制气泡以创建半透明圆圈 - 任何人都可以告诉我，如果这样或多或少的代价（在客户端性能方面）将图像/精灵贴到画布上？

-Mike

来源

2011-08-24 Mikey Hogarth

绘制圆弧/圆圈比绘制图像昂贵得多。绘制图像最有可能是将任何东西绘制到画布上最有效的方法。我在这个主题上写了我的Bachelor Thesis。这是德语，但基本上使用弧线和弧线绘制弧线时，IE9中的速度低于15.000次/秒。绘制图像时，您每秒可以执行超过160.000次操作。

来源

2011-08-24 10:18:10

感谢哥们，现在就试试看。 –

好的 - 我用图像而不是弧来实现它，并且确实看到IE9性能略有增加（不是负载，但是我在这里做的并不是如此密集，我确信图像方法会更好）。 –

您可以通过重新绘制实际更改的画布部分来加速画布绘制。您可以通过在清除和重新绘制矩形之前使用剪辑设置剪切区域来完成此操作。此外，您可以对裁剪区域执行可见性剔除，以仅实际调用位于脏矩形内的这些项目上的绘画方法。这些是众所周知的技术来加速图形绘制。虽然他们可能不适合你的情况。此外，如果您遇到性能问题，请对其进行描述并找出实际存在的瓶颈。 –

Canvas tag - drawarc vs image

回答

相关问题