日期:2014-05-16  浏览次数:20468 次

JS优化经验

1.定义局部变量。对于当前函数作用域内,如果需要使用这个作用域外部的一些变量,那么就尽量使用局部变量储存外部的变量吧,特别是对于嵌套多级的作用域查询,这个耗时也是比较严重的。还有就是获取DOM节点、NodeList、HTMLCollection等等,可以将NodeList、HTMLCollection转化为数组的形式进行操作,减少DOM即时更新所造成的性能消耗。?

2.不要使用with语句。with语句会在当前作用域下面增加作用域链,造成当前作用域下面变量的遍历性能消耗更大。?

3.对于闭包的使用,节省点,不要太过多了。闭包就是提供一个所谓的“封闭式”的作用域,只允许向包含它向别人访问,而不允许别人访问它。但是声明一个闭包的代价比声明普通的函数的代价是要更高的,况且还有IE下内存泄漏的危险。?

4.获取字面量对象的属性和数组的项比获取变量更慢。如果你要获取一些数据的时候,使用变量比用数组、字面量对象的索引来访问来的更快。在循环中经常会需要访问数据,使用变量存储一下,来的更快。?

5.在数组中不要嵌套的过深。js中没有二维数组的概念,但是可以自己编写一个二维数组,并且可以无限的嵌套下去,json很经常就是这么干的。但是嵌套的越深,访问数组中的项就更难了,级数和性能消耗成正比的。?

6.少用for-in循环。众所周知,for-in用于遍历对象的属性和方法,它所要消耗比for、while、do-while更多的性能。在for-in循环中,对于每一个循环,javasript需要创建一个函数来处理每一个循环,这就带来这么两个性能问题:函数创建、销毁的过程;这个函数在创建之后,又会储存它直接上级的作用域的活动对象。?

7.对于循环,合并控制循环的语句,以及控制变量变化方式。在一个控制循环的语句中,比如循环结束条件、索引的递增等等,如果可以优化这些操作,那么对于整个循环的性能是有帮助的。比如对于结束循环条件:for(var i =0;i<10;i++),每次循环的时候,都要执行:#1 i是否存在;#2 i是否 < 10;#3 i++。优化一下,使用while或者do-while:var i = 9;do { ...} while(i--),那么这样之后,每一个循环需要执行的操作:#1 i--;#2 i是否为true。这样就对循环条件的执行步骤进行了简化。?

8.对于HTMLCollection,尽量定义一个数组来储存它。这样可以避免DOM即时更新所造成的影响。?

9.在操作DOM节点的时候,尽量让它飘了吧。让DOM元素脱离document之后再对它进行操作,最后再重新插回document中,最小化reflow(改变了DOM元素布局性的相关的属性之后就会触发,比如:height、width等)、repaint(改变了DOM元素显示上的变化就会触发,比如:background、color等)所造成的影响。?

10.改变DOM节点样式的时候,尽量改变DOM元素的class而不是style属性。原因你懂的……?

规则是死的,不能泛用;规则又是活的,看你是否活学活用,用到思维里去,在你编写代码的时候就可以随手写出符合这些规则的代码。