公司是做教育类游戏开发,以前是用flash制作,现在开始使用CreateJS框架开发Canvas游戏。今天突然收到一个任务:游戏在iPad2下面游戏会打不开,然后自动刷新,再加载不出来,然后再刷新,陷入了死循环……
发现问题:
屏幕左上角提示 “因出现错误 重新加载了网页”
解决问题:
通过度娘得知此问题是由越狱或内存引起的。排除越狱可能(因为没有越狱),剩下就是内存问题。打开Chrome更多工具里面的任务管理器(快捷键Shift+Esc)看到单页内存占用量一路飙升到800,000K左右,当时自己都吓了一跳。(Bug真是一个神奇的物种,想重现场景自己倒害羞不出来了,有机会把图补上)。
我们知道iPad2 的内存大小是512MB,为了确定是内存太小引起的问题,特意用同事的iPhone 5s(1G内存)测试,发现可以正常使用。于是开始着手减少页面内存占用问题。
由于游戏内资源文件太多,所以为保证游戏流畅对音频、图片进行预加载。首先从音频着手,将音频部分的预加载去掉(因为音频数量不多,而且声音短,随用随调产生不了太大影响),发现内存占用量立马下降至132MB左右,看来这一步是走对了;将页面的script标签移至body底部,避免<script>标签下载时阻塞页面解析过程,以减少首屏时间,提高用户体验;将常用的库文件使用CDN发布,当库文件第一次被加载时会被缓存起来,如果没有被清理或修改,浏览器会自动读取该文件而不是重新下载文件,减少了网络消耗。
在线Demo请移步 → http://121.42.8.151:2953/HBA003/index.html
时间: 2024-12-29 23:29:38