Question

您好我正在学习使用easelJS编写基于浏览器的游戏。教程很顺利，但我在Chrome上播放动画时发现了一些问题。

Chrome运动动画效果较慢，一旦相同的动画无法再次播放，一旦完成播放，除非我重新加载页面。

在Firefox中运行它没有任何这些问题。

这是链接:(使用inspect元素代码）

我听说Chrome中存在一些缓存问题，所以我认为这可能是问题所在。手动删除缓存确实允许动画在没有页面重新加载的情况下再次播放，但它仍然运行缓慢（将其与firefox进行比较）。

由于我想编写跨浏览器兼容性的代码，因此有一种受支持的方式来解决这些问题吗？如阻止将图像存储在缓存中还是什么？（我希望最后一招）

提前致谢，

恭平

编辑：似乎动画的速度在ie10上是相同的，所以不知道你应该知道它的速度。

Answer 1

“重置”后无法使用的原因是您依靠图像加载事件来启动动画。这将是第一次，但第二次，图像已经加载，因此你永远不会从图像中获得onload事件（意思是没有“startGame（）”。

由于这是一个简单的例子，也许最好的方法是每次都创建新的图像。只需将这些行移动到init：

function init() {
    var imgMonsterARun = new Image();
    var imgMonsterAIdle = new Image();
    // Other stuff
}

Answer 2

我读了一篇文章Fix your Timestep它会对你有所帮助，只需将其转换为javascript，仔细阅读。