看书看到了javascript 循环性能优化的几种方法 ,有的之前已经知道并且已经在使用了,有的第一次接触,觉得挺有意思。总结在这里,方便需要时复习,也分享给大家。
【方法一】 缓存对象成员数组项(包括HTMLCOLLECTION等类数组对象)
优化前:
for(var i = 0; i < items.length; i++){
doSomething(items[i]);
}
可以通过缓存item的length减少读取item对象属性的次数来达到优化性能的目的,在大多数浏览器中能节省大约25%左右的性能。
优化后:
for(var i = 0, len = items.length; i < len; i++){
doSomething(items[i]);
}
【方法二】倒序循环
优化前:
for(var i = 0, len = items.length; i < len; i++){
doSomething(items[i]);
}
可以通过倒序减少控制条件比较的数目来优化性能。
优化后:
for(var i = items.length; i--;){
doSomething(items[i]);
}
【方法三】Duff’s Device
可参考:js系能优化
主要思想是展开循环,减少总循环次数。
// Speed Up Your Site(New Riders, 2003)
function process(v) {
alert(v);
}
var values = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17];
var iterations = Math.floor(values.length / 8);
var leftover = values.length % 8;
var i = 0;
if(leftover > 0) {
do {
process(values[i++]);
}while(--leftover > 0);
}
do {
process(values[i++]);
process(values[i++]);
process(values[i++]);
process(values[i++]);
process(values[i++]);
process(values[i++]);
process(values[i++]);
process(values[i++]);
}while(--iterations > 0);