我正在使用Phonegap为iPad创建游戏,这意味着我正在为iPad的Safari使用JavaScript/CSS/HTML.基本上,我正在以1024x768分辨率移动大量img元素(有时更改其src),只是本地文件没有任何网络连接.在桌面上Safari的工作顺利,但在iPad上,我的setInterval感觉延迟和闪烁.你能为我提供任何速度优化技巧吗?谢谢!
PS:我知道切换到iOS的原生Objective-C可能会快得多,但我真的很想用标准的JS/HTML/CSS来尝试它.
您遇到了动画网页最常见的浏览器脚本问题之一.
应用程序运行速度降低的原因是浏览器是单线程环境.一旦你忘记了你就会遇到麻烦.
setInterval
让您相信您的操作将像多线程环境一样并行发生.但真正发生的是setInterval
将操作推送到UI堆栈以便稍后处理.但是如果有太多事情一次进入这个堆栈,一些行动将会滞后.该setInterval
会继续推动新的行动,但旧的将仍然存在,整个渲染成为一个缓慢的混乱.
至于何时发生,它取决于硬件/软件功能.iPad的马力比台式机低得多,这是非常明显的.
你可以做的事情,以避免滞后.
交易顺畅性:提高间隔之间的延迟,以避免UI堆栈中的累积操作.
setTimeout:这个替代方案非常类似setInterval
,除了它不能确保重复之间的给定间隔,而是关注浏览器在重复动作之前应该等待多长时间.因此,为了使其更像是setInterval
您可能需要跟踪操作之间经过的时间并计算必须处理的更改的度量.
组动画:您可以为一些相关动画设置一个间隔(为它们管理一个小型队列),这样您可以减少实际的setInterval调用,并在控制竞争条件方面获得更多权力.
另外请务必阅读这篇文章:
制作iPad HTML5应用程序并使其速度非常快(Thomas Fuchs是script.aculo.us的创建者)