This topic is the place I always wanted to summarize. Mainly the following aspects from the discussion.
DOM object-related variables and
1.Not defined to avoid the use of variables, because the browser will find the variable layers up to the last have not found it to define a new variable, and this performance will be affected.
3.Cache frequently used variable properties. For example:
obj.style.fontSize=”1px”;
obj.style.color=”red”;
obj.style.border=”1px”;
obj.style.padding=”1px”;
Should be changed：
var style=obj.style;
style.fontSize=”1px”;
style.color=”red”;
style.border=”1px”;
style.padding=”1px”;
3.Local variables and global variables
Faster than local variables faster access to global variables, because the global object global variable is a member of the local variable stack is placed among the function。
4.Way to make use of the id instead of pre (), next () and other nodes of the second lookup operation
5.Line defines the number of variables
Example code：
var a,b,c,d=0,s="",arr=[],obj={};
13. Insert iterator
示例代码：
sum+=a[i];
i++;
优化：
sum+=a[i++];
与数组相关
1.Use new operator to create less array
Reason to create the function with the new operation. especially when large amounts of data in a more obvious
a = [1, 2, 3]; // 4360ms
a = new Array(1, 2, 3); // 5000ms
2.尽量避免使用 push() 和 pop() 处理数组数据.
a[i] = value; // 1270ms
a.push(value); // 3240ms
Optimization of data types associated with
1.Floating point to integer conversion, the more prone to error, many people prefer to use parseInt (), in fact, parseInt () is used to convert a string into a digital, rather than the conversion between floating point and integer, we should use the Math . floor () or Math.round ().
另外，和第二节的对象查找中的问题不一样，Math是内部对象，所以Math.floor()其实并没有多少查询方法和调用的时间，速度是最快的。
2.不使用Eval
Equivalent to at run time Use eval is called again to explain the content to run the engine, you need to consume large amounts of time. This time supported by the Use JavaScript closures can function template (on the contents of the closure, please refer to the relevant functional programming content)
与字符串相关的优化
1.字符串连接
如果是追加字符串，最好使用s+=anotherStr操作，而不是要使用s=s+anotherStr。
如果要连接多个字符串，应该少使用+=，如
s+=a;s+=b;s+=c;
应该写成
s+=a + b + c；
而如果是收集字符串，比如多次对同一个字符串进行+=操作的话，最好使用一个缓存。怎么用呢？使用JavaScript数组来收集，最后使用join方法连接起来，如下
var buf = new Array();for(var i = 0; i < 100; i++){ buf.push(i.toString());}var all = buf.join(“”);
2. 字符串与其它数据类型之间的转换优化
把数字转换成字符串，应用”" + 1，虽然看起来比较丑一点，但事实上这个效率是最高的，性能上来说：
(“” +) > String() > .toString() > new String()
这条其实和下面的”直接量”有点类似，尽量使用编译时就能使用的内部操作要比运行时使用的用户操作要快。
String()属于内部函数，所以速度很快，而.toString()要查询原型中的函数，所以速度逊色一些，new String()用于返回一个精确的副本。
与运算符相关的优化
1.使用 ++ 代替 x = x+1 和 +=.
事实上 ++ 并不比 + 和 += 快很多, 但是在大量的操作时就会体现出其优势.
而 + 和 += 几乎没有性能差别. 同理对 -- 和 - 以及 -= 适用.
x++; // 378ms
x = x+1; // 406ms
x += 1; // 406ms
与对象相关的优化
1.数组对象的创建
其实这个影响倒比较小，可以忽略。什么叫使用直接量，比如，JavaScript支持使用[param,param,param,...]来直接表达一个数组，以往我们都使用new Array(param,param,…)，使用前者是引擎直接解释的，后者要调用一个Array内部构造器，所以要略微快一点点。
2.object对象的创建以及初始化
var foo = {}的方式也比var foo = new Object();
3.RegExp() 正则表达式的创建
var reg = /../;要比var reg=new RegExp()快。
4.使用局部变量缓存对象属性和函数指针
例如在遍历数组时缓存数组长度, 事实上获取 Javascript 的数组长度等于调用一个方法函数(大部分Javascript 引擎是这样实现的).
如果对 HTML DOM 进行操作, 那么优化的效果会非常明显.
for(var i=0;i<arr.length;i++){ ... } // 162ms
var length = arr.length;
for(var i=0;i<length;i++){ ... } // 156ms
或者使用局部变量缓存一个外部函数(具体效果视代码复杂度而定).
如果代码块中要多次调用一个外部函数或变量, 那么缓存的效果会非常明显.
function test(){ ... }
function run1(){ test(); }
function run2(){ var t = test; t(); }
run1(); // 98ms
run2(); // 80ms
语句块的优化
优化if()
示例：
if(a){}else if(b){}else if(c){}else{} //其中c的可能性最大
优化：
if(c){}else if(a){}else if(b){}else{} //把可能性最大的放前面，以减少判断次数
其它的函数优化
1. 如果针对的是不断运行的代码，不应该使用setTimeout，而应该是用setInterval。setTimeout每次要重新设置一个定时器。
浙公网安备 33010602011771号