我正在开发一款HTML5 Canvas游戏,主要针对移动设备进行设计。Canvas被调整为可用分辨率的最大值,以实现屏幕全屏游戏效果。
在iPad上,Canvas的分辨率是1024x786,此时帧率明显下降。而在像iPhone上480x320这样较小的分辨率下,游戏运行很流畅!我猜想这是因为设备填充速度有限所致。
无论如何,我希望尽可能地优化游戏性能。如果您有任何HTML5 Canvas开发的通用性能技巧,请告诉我,我将不胜感激。
我正在开发一款HTML5 Canvas游戏,主要针对移动设备进行设计。Canvas被调整为可用分辨率的最大值,以实现屏幕全屏游戏效果。
在iPad上,Canvas的分辨率是1024x786,此时帧率明显下降。而在像iPhone上480x320这样较小的分辨率下,游戏运行很流畅!我猜想这是因为设备填充速度有限所致。
无论如何,我希望尽可能地优化游戏性能。如果您有任何HTML5 Canvas开发的通用性能技巧,请告诉我,我将不胜感激。
text-shadow
&box-shadow
opacity
(有时会影响硬件加速渲染)translate3d
而不是translate
(后者没有进行硬件加速)getImageData
(主要会减慢速度) [2]以下是更多链接:
由于我对你的游戏不太熟悉,很难给出具体的建议。但你可能希望将渲染分成多个层。如果有一些静态元素,这样做很有意义。这样可以避免一些清除操作,并最终得到更好的代码。