优化代码性能

电玩女神 2023-03-01 09:13 27阅读 0赞

## 优化代码性能（javascript描述） ##

## 1. 避免不必要的属性查找 ##

在计算机领域中，计算的复杂度是使用O符号表示的，最简单的算法是常数O(1),下面列出常见的算法类型的负责度

<table> 
 <thead> 
  <tr> 
   <th>标记</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>O(1) 常数</td> 
   <td>不管多少值，执行的时间都是恒定的。一般表示简单值和存储在变量中的值</td> 
  </tr> 
  <tr> 
   <td>O(log n) 对数</td> 
   <td>总的执行时间和值的数量相关，但是要完成算法并不定要获取每个值。例如：二分查找</td> 
  </tr> 
  <tr> 
   <td>O(n) 线性</td> 
   <td>总执行时间和值的数量直接相关。例如：遍历某个数组中所有元素</td> 
  </tr> 
  <tr> 
   <td>O(n^2) 平方</td> 
   <td>总执行时间和值的数量有关，每个值至少要获取N次。例如：插入排序</td> 
  </tr> 
 </tbody> 
</table>

var value = 5;
    var sum = 10 + value;
    alert(sum);

该代码进行了四次常量值查找：数字5，变量value,数字10和变量sum。以上代码的整体复杂度被认为是O(1)。

var value = ｛first：5，second：10｝;
    var sum = value.first +value.second;
    alert(sum);

这段代码使用两次属性查找来计算sum的值。进行一两次属性查找并不会导致显著的性能问题，但是进行成百上千肯定会减慢执行速度。以上代码的整体复杂度被认为是O(n)。

注意获取单个值的多重属性查找。例如，请看一下代码

var query = window.location.herf.substring(window.location.href.indexOf("?"));

这段代码中有6次属性的查找：window.location.href.substring()有3次，window.location.href.indexOf()又有3次。只要数一数代码中的点的数量，就可以确定属性查找的次数了。这段代码由于两次用到了window.location.href，同样的查找进行了两次，因此效率特别不好。  
一旦多次用到对象属性，应该将其存储在局部变量中。第一次访问该值会是O(n),然后后续的访问都是O(1),这就会节省很多重复的查询。例如之前的代码可以重写如下：

var url = window.location.href;
    var query = url.substring(url.indexOf("?"));

这个版本中只有4次属性查询，相对于原始版本中节省33%，在更大的脚本中进行这种有优化，倾向于获得更多改进

## 优化循环(常用方法) ##

1.  减值迭代——大多数循环使用一个从0开始、增加到某个特定值的迭代器。在很多情况下，从最大值开始，在循环中不断减值的迭代器更加高效
2.  简化终止条件——由于每次循环中都会计算终止条件，所以必须保证它尽可能快，也就是说避免属性查找或其他O(n)的操作  
    用一个例子来描述这种改动。以下是一个基本的for循环

for(var i = 0;i<values.length;i++){ 
    let el= values[i]
    //执行内容
    }

这段代码中变量I从0递增到values数组中的元素总数。假设值的处理顺序无关紧要，那么循环可以改为i减值

for(var i = values.length-1;i>=0;i--){ 
    let el= values[i]
    //执行内容
    }

这里变量i每次循环之后都会减1。在这个过程中，将终止条件从vales.length的O(n)调用简化成了0的O(1)调用。

## 其他性能注意事项 ##

1.  Switch语句较快—— 如果有一系列复杂的if-else语句，可以转换成单个switch语句则可以得到更快的代码。还可以通过将case语句按照最可能的到最不可能的顺序进行组织，来进一步优化switch语句
2.  位运算符较快—— 单进行数学运算的时候，位运算操作要比任何别运算或者算数运算快。选择性地用位运算替换算数运算可以极大提升复杂计算的性能。
3.  优化DOM交互——在javascript各个方面中。dom毫无疑问是最慢的一部分。dom操作与交互要消耗大量的时间，因为它们往往需要重新渲染整个页面或者某一部分。进一步说，看似细微的操作也可能要花很久来执行，因为dom要处理非常多的信息。一句话，尽量减少dom的操作。