TAT.melody 从 Audio 标签看 webkit 内存上涨的问题
In HTML5 on 2012年02月28日 by view: 2,610
0

这段时间做一个关于 widget 的项目,忙了一两个月了。在临发布的时候突然出现一个问题,一个音乐 widget 的内存不断上涨,且不会回落,最终导致这个 widget 只能下架。
因为我在 ie9 没发现内存上涨的问题,所以我觉得这是 webkit 内存管理的问题。所以一直没去看他,等待客户端的同事去解决。直到有一天,客户端同事说了一个方法,说防止 src 频繁切换,建议延迟 1s 去设置 audio 标签的 src。开始我想这不是 web 的原因,所以给予断然拒绝,另外也是怕维护麻烦。但是,我还是进行了尝试。没想到效果出奇的明显,内存基本不会上涨了。
从这件事,我意识到了,凡事不能说绝对。因为它包括了太多情况,涵盖了很长的一段时间,而且使你不能有回旋的余地。
下面说说解决的方法。因为我们想要的是 src 不频繁切换,所以单单做延迟是不会有任何结果的。关键是要使一首歌保持 1s 以上才会去设置它的 src。这句话我说来简简单单,但是要真正理解是需要很深入的思考的。代码我会在最后面给出来,大家可以自己试着写写,然后对照一下。
通过客户端同事的进一步研究发现,发现对 Dom 对象的某个属性就行频繁操作就会导致上涨。这里还有个比较明显的属性就是 buffered,大家可以通过设置一个频率为 20ms 的定时器去读取这个属性,就可以进行测试了。
以此类推,是否对于 img 标签也有类似的情况呢。这个有待各位同仁进行验证。
相关代码:

飞行射击类游戏很常用的追踪子弹,或者塔防里面固定炮台打 怪物的时候,为了保证子弹不会打空,追踪是必要的。
然而,这是极其简单的事情。
在每一帧里判断当前子弹和目标位置的距离和方向,不断修正 速度方向即可。

【已知】
canvas 提供了 toDataURL 的接口,可以方便的将 canvas 画布转化成 base64 编码的 image。目前支持的最好的是 png 格式,jpeg 格式的现代浏览器基本也支持,但是支持的不是很好。

 一、些许前提

最近在制作一个 Web 应用, 其中用到了 HTML5 的离线应用功能 (offline application), 离线应用的概念就不再阐述, 可以查看这两篇文章:

http://www.ibm.com/developerworks/cn/web/1011_guozb_html5off/

http://www.mhtml5.com/2011/02/583.html

这里主要讨论它的更新问题. 首先浏览器是有两部分 cache 的, browser cache 和 app cache, browser cache 就是常说的浏览器缓存, app cache 是离线应用的缓存.