JavaScript游戏之优化篇
by Floyd
at 2010-11-05 14:45:00
original http://www.cnblogs.com/floyd/archive/2010/11/05/1869943.html
最近回头看看自己以前写的游戏代码，总结出几个可以优化改进的地方，当然还有很多地方需要优化，还希望大家指出来。
1。善用DocumentFragment
之前有个打飞机的游戏。我是用如下方法添加子弹
2 var bullet = new Bullet();
3 document.body.appendChild(bullet);
4 }
问题就来了，我的目的是希望同时能出现5颗子弹，所以我循环将5个子弹对象添加到body，这样会导致一个结果：浏览器reflow了5次。
但其实可以找一个载体，来先把这5个子弹类装起来，然后，再一次性添加到body中，这样就只会出现一次flow。节省不少开销。
2 for(var i=0;i<5;i++){
3 var bullet = new Bullet();
4 df.appendChild(bullet);
5 }
6 document.body.appendChild(df);
DocumentFragment：文档碎片，它不会产生任何标签，只是一个载体。
2。对引用值置空，Dom自定义的引用值也置空。
发觉自己写的代码，很多引用类型的值，都没有在变量结束的时候置空。
例如：
2 this.dom = null;
3 this.init();
4 }
5 Bullet.prototype = {
6 this.init : function(){
7 this.dom = document.createElement('div');
8 document.body.appendChild(this.dom);
9 }
10 this.end : function(){
11 document.body.removeChild(this.dom);
12 }
13 }
在结束的时候单纯只是将dom对象移除，其实还需要将this.dom = null。免得内存的浪费，特别是IE系列。
3。循环判断中加标识，减少Dom属性判断。
根据游戏的逻辑，例如是男人就下一百层。
当小人站立在一个方块上面，这个时候，其它的方块，可以不需要再判断小人是否会掉落到自己的方块上，只需要往上升就行了。这样，一秒可以减少好几百次
对dom元素的属性访问，减少开销。当小人离开方块的时候，判断再次生效。合理利用。
附上自己写的:是男人就下100层传送门>>
暂时就发现那么多，以后发现更多的话，再写吧。。。
作者: Floyd 发表于 2010-11-05 14:45 原文链接
最新新闻：
· 纽约时报：机器人让你远程了解住所安全(2010-11-06 17:48)
· Mozilla发布Firefox 4.0 Beta 7 RC(2010-11-06 17:40)
· Gmail通话录音功能即将出炉(2010-11-06 17:34)
· 用JavaScript来写Gameboy模拟器(2010-11-06 17:20)
· Kik Messenger本周在App Store上爆发，冲到排行榜首位(2010-11-06 17:15)