十条js优化原则

分类:Javascript| 发布:camnprbubuol| 查看: | 发表时间:2011/11/9
  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属性。原因你懂的……

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

英文原文:http://jonraasch.com/blog/10-javascript-performance-boosting-tips-from-nicholas-zakas

365据说看到好文章不转的人,服务器容易宕机
原创文章如转载,请注明:转载自郑州网建-前端开发 http://camnpr.com/
本文链接:http://camnpr.com/archives/488.html