移动设备 Android Chrome 无法与 HTML5 和 CREATEJS 配合使用 - 冻结问题
Mobile Android Chrome not working great with HTML5 and CREATEJS - freezing issues
我使用 HTML5 和 CREATEJS 开发了一个应用程序。我遇到了几个星期都找不到解决方案的问题。我希望有人能帮帮忙。
1)在 Android Google Chrome 上，当我简单地单击屏幕上的任意位置时会出现一个问题：FPS 下降并且任何正在播放的动画都会冻结我触摸的持续时间。问题仅出现在移动 Chrome 浏览器中，在 Android 上。它不存在于其他移动浏览器中，也不存在于 iPhone 中，也不存在于 Safari、Firefox 等中。
我使用 webview 创建了一个简单的 apk，它也没有问题。所以出于某种原因，问题只出现在移动 android chrome.
代码已最大优化。 2 个月前我们只使用了 1 个 canvas，但现在我们使用了多个 canvas，而且每次 canvas 运行 中的动画更少。在 android firefox 中，它运行完美，但在 android chrome 中，单击一下就会冻结。
我试图禁用 stagemousedown/up 事件，因为当我在舞台上的任何地方单击时它们都会被触发。这并没有解决问题，或者可能存在一些我不知道如何禁用的隐藏 stagetouch 事件。
2)在 Android Google Chrome 和 iPhone6 Safari 上，当我点击 SPIN 按钮时，游戏开始 SPIN，但延迟为至少 1.5 秒，但代码中没有故意添加此类延迟。在 PC 上的任何浏览器上，Android/iOS Mobile Firefox，完美无延迟。在 iOS Safari iPhone8 中再次完美运行。
我使用 webview 创建了一个简单的 apk，它也没有这个问题。所以出于某种原因，问题只出现在移动 android chrome 中。
更新 2019 年 11 月 10 日：问题 2 已通过减小 canvas 大小并删除所有消耗大量内存的阴影效果来解决。问题 1 仍然没有解决，完全没有想法可以尝试。感谢任何帮助。
除了这两个问题，我的项目已经完成了 99%。我希望能够修复它们，因为我真的不想放弃几个月的工作并切换到其他 javascript 游戏库，它没有问题，比如 PIXIJS。
我尝试使用 RAF 和 RAF_SYNCHED，但在任何情况下都没有改善。
Stage.update() 是任何动画所必需的。将它们放在自动收报机上是它变慢的原因。
要查看实际问题，请打开此 URL：http://www.nevergone.biz/DEMO_CODE/index.html
测试方法：在AndroidGoogleChrome纵向模式下打开上面的link，然后点击SPIN。在 SPIN 期间，单击游戏上方的 canvas 或任意位置。请注意，一切都冻结了。
提取代码只是为了测试这些问题，因此旋转几次后可能会冻结。我明天会解决这个问题，但我希望有人能提供一些解决问题的想法。
缓存可能会起作用。
var testShape=new createjs.Shape();
testShape.graphics.beginFill("red").rect(0,0,100,100);
testShape.cache(0,0,100,100);
stage.addChild(testShape);
// If you make changes and want to refresh the cache
testShape.updateCache()
问题 #1 显然在一些使用 Android Google Chrome 的旧设备上是孤立的。这个问题不知何故是由 CREATEJS 在 stagedown 事件上使用了太多的监听器引起的。我目前正在等待框架的开发人员给出答案或等待 Chrome 收到正式更新。
问题 #2 已通过删除所有明显占用大量内存的文本阴影 CSS 效果得到解决。
我使用 HTML5 和 CREATEJS 开发了一个应用程序。我遇到了几个星期都找不到解决方案的问题。我希望有人能帮帮忙。
1)在 Android Google Chrome 上，当我简单地单击屏幕上的任意位置时会出现一个问题：FPS 下降并且任何正在播放的动画都会冻结我触摸的持续时间。问题仅出现在移动 Chrome 浏览器中，在 Android 上。它不存在于其他移动浏览器中，也不存在于 iPhone 中，也不存在于 Safari、Firefox 等中。 我使用 webview 创建了一个简单的 apk，它也没有问题。所以出于某种原因，问题只出现在移动 android chrome.
代码已最大优化。 2 个月前我们只使用了 1 个 canvas，但现在我们使用了多个 canvas，而且每次 canvas 运行 中的动画更少。在 android firefox 中，它运行完美，但在 android chrome 中，单击一下就会冻结。
我试图禁用 stagemousedown/up 事件，因为当我在舞台上的任何地方单击时它们都会被触发。这并没有解决问题，或者可能存在一些我不知道如何禁用的隐藏 stagetouch 事件。
2)在 Android Google Chrome 和 iPhone6 Safari 上，当我点击 SPIN 按钮时，游戏开始 SPIN，但延迟为至少 1.5 秒，但代码中没有故意添加此类延迟。在 PC 上的任何浏览器上，Android/iOS Mobile Firefox，完美无延迟。在 iOS Safari iPhone8 中再次完美运行。 我使用 webview 创建了一个简单的 apk，它也没有这个问题。所以出于某种原因，问题只出现在移动 android chrome 中。 更新 2019 年 11 月 10 日：问题 2 已通过减小 canvas 大小并删除所有消耗大量内存的阴影效果来解决。问题 1 仍然没有解决，完全没有想法可以尝试。感谢任何帮助。
除了这两个问题，我的项目已经完成了 99%。我希望能够修复它们，因为我真的不想放弃几个月的工作并切换到其他 javascript 游戏库，它没有问题，比如 PIXIJS。
我尝试使用 RAF 和 RAF_SYNCHED，但在任何情况下都没有改善。 Stage.update() 是任何动画所必需的。将它们放在自动收报机上是它变慢的原因。
要查看实际问题，请打开此 URL：http://www.nevergone.biz/DEMO_CODE/index.html
测试方法：在AndroidGoogleChrome纵向模式下打开上面的link，然后点击SPIN。在 SPIN 期间，单击游戏上方的 canvas 或任意位置。请注意，一切都冻结了。
提取代码只是为了测试这些问题，因此旋转几次后可能会冻结。我明天会解决这个问题，但我希望有人能提供一些解决问题的想法。
缓存可能会起作用。
var testShape=new createjs.Shape();
testShape.graphics.beginFill("red").rect(0,0,100,100);
testShape.cache(0,0,100,100);
stage.addChild(testShape);
// If you make changes and want to refresh the cache
testShape.updateCache()
问题 #1 显然在一些使用 Android Google Chrome 的旧设备上是孤立的。这个问题不知何故是由 CREATEJS 在 stagedown 事件上使用了太多的监听器引起的。我目前正在等待框架的开发人员给出答案或等待 Chrome 收到正式更新。
问题 #2 已通过删除所有明显占用大量内存的文本阴影 CSS 效果得到解决。