JS编程建议——21:推荐提高循环性能的策略(2)

简介: 21:推荐提高循环性能的策略(2)

建议21:推荐提高循环性能的策略(2)
在每个循环中,每次运行循环体都要发生如下操作:
第1步,在控制条件中读一次属性(items.length)。
第2步,在控制条件中执行一次比较(i < items.length)。
第3步,比较操作,观察条件控制体的运算结果是不是true(i < items.length == true)。
第4步,一次自加操作(i++)。
第5步,一次数组查找(items[i])。
第6步,一次函数调用(process(items[i]))。
在这些简单的循环中,即使没有太多的代码,每次迭代都要进行这6步操作。代码运行速度很大程度上由process()对每个项目的操作所决定,即便如此,减少每次迭代中操作的总数也可以大幅度提高循环的整体性能。
优化循环的第一步是减少对象成员和数组项查找的次数。在大多数浏览器上,这些操作比访问局部变量或直接量需要更长时间。例如,在上面代码中,每次循环都查找items.length,这是一种浪费,因为该值在循环体执行过程中不会改变,因此产生了不必要的性能损失。我们可以简单地将此值存入一个局部变量中,在控制条件中使用这个局部变量,从而提高了循环性能,例如:

  1. for (var i=0, len=items.length; i < len; i++){
  2. process(items[i]);
  3. }
  4. var j=0, count = items.length;
  5. while (j < count){
  6. process(items[j++]);
  7. }
  8. var k=0, num = items.length;
  9. do {
  10. process(items[k++]);
  11. } while (k < num);
    这些重写后的循环只在循环执行之前对数组长度进行一次属性查询,使控制条件中只有局部变量参与运算,因此速度更快。根据数组的长度,在大多数浏览器上总循环时间可以节省大约25%,在IE浏览器中可节省50%。

还可以通过改变循环的顺序来提高循环性能。通常,数组元素的处理顺序与任务无关,可以从最后一个开始,直到处理完第一个元素。倒序循环是编程语言中常用的性能优化方法,不过一般不太容易理解。在JavaScript 中,倒序循环可以略微提高循环性能,例如:

  1. for (var i=items.length; i--; ){
  2. process(items[i]);
  3. }
  4. var j = items.length;
  5. while (j--){
  6. process(items[j]);
  7. }
  8. var k = items.length-1;
  9. do {
  10. process(items[k]);
  11. } while (k--);
    在上面代码中使用了倒序循环,并且在控制条件中使用了减法。每个控制条件只是简单地与零进行比较。控制条件与true 值进行比较,任何非零数字自动强制转换为true,而零等同于false。实际上,控制条件已经从两次比较减少到一次比较。将每次迭代中两次比较减少到一次可以大幅度提高循环速度。通过倒序循环和最小化属性查询,可以看到执行速度比原始版本提升了50%~60%。

与原始版本相比,每次迭代中只进行如下操作:
第1步,在控制条件中进行一次比较(i == true)。
第2步,一次减法操作(i--)。
第3步,一次数组查询(items[i])。
第4步,一次函数调用(process(items[i]))。
新循环的每次迭代中减少两个操作,随着迭代次数的增长,性能将显著提升。

相关文章
|
7月前
|
监控 负载均衡 JavaScript
有哪些有效的方法可以优化Node.js应用的性能?
有哪些有效的方法可以优化Node.js应用的性能?
372 69
|
8月前
|
JavaScript 前端开发 Java
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
234 24
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
|
7月前
|
监控 算法 JavaScript
公司局域网管理视域下 Node.js 图算法的深度应用研究:拓扑结构建模与流量优化策略探析
本文探讨了图论算法在公司局域网管理中的应用,针对设备互联复杂、流量调度低效及安全监控困难等问题,提出基于图论的解决方案。通过节点与边建模局域网拓扑结构,利用DFS/BFS实现设备快速发现,Dijkstra算法优化流量路径,社区检测算法识别安全风险。结合WorkWin软件实例,展示了算法在设备管理、流量调度与安全监控中的价值,为智能化局域网管理提供了理论与实践指导。
194 3
|
9月前
|
JavaScript Ubuntu Linux
如何在阿里云的linux上搭建Node.js编程环境?
本指南介绍如何在阿里云Linux服务器(Ubuntu/CentOS)上搭建Node.js环境,包含两种安装方式:包管理器快速安装和NVM多版本管理。同时覆盖全局npm工具配置、应用部署示例(如Express服务)、PM2持久化运行、阿里云安全组设置及外部访问验证等步骤,助你完成开发与生产环境的搭建。
|
9月前
|
JavaScript 前端开发 算法
JavaScript 中通过Array.sort() 实现多字段排序、排序稳定性、随机排序洗牌算法、优化排序性能,JS中排序算法的使用详解(附实际应用代码)
Array.sort() 是一个功能强大的方法,通过自定义的比较函数,可以处理各种复杂的排序逻辑。无论是简单的数字排序,还是多字段、嵌套对象、分组排序等高级应用,Array.sort() 都能胜任。同时,通过性能优化技巧(如映射排序)和结合其他数组方法(如 reduce),Array.sort() 可以用来实现高效的数据处理逻辑。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
9月前
|
JavaScript 前端开发 Java
深入理解 JavaScript 中的 Array.find() 方法:原理、性能优势与实用案例详解
Array.find() 是 JavaScript 数组方法中一个非常实用和强大的工具。它不仅提供了简洁的查找操作,还具有性能上的独特优势:返回的引用能够直接影响原数组的数据内容,使得数据更新更加高效。通过各种场景的展示,我们可以看到 Array.find() 在更新、条件查找和嵌套结构查找等场景中的广泛应用。 在实际开发中,掌握 Array.find() 的特性和使用技巧,可以让代码更加简洁高效,特别是在需要直接修改原数据内容的情形。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一
|
9月前
|
前端开发 JavaScript 大数据
关于JavaScript性能问题的误解
JavaScript 是单线程语言,代码逐行执行,遇到大数据量计算可能影响性能。前端同事担心遍历大量数据会导致性能问题,但实际上,即使遍历1000、10000条数据,耗时也较少。测试代码执行时间有三种方法:Date.now、console.time 和 performance.now,其中 performance.now 精度最高。开发中不必过度担忧遍历带来的性能损耗,保持代码清晰更重要。
|
10月前
|
JavaScript 前端开发 IDE
【编程向导】Js与Ts差异详解:选择与权衡
JavaScript 一直是 Web 开发的基石,以其灵活性和动态性著称,但其松散类型可能导致大型项目中出现难以调试的错误。TypeScript 作为 JavaScript 的超集,通过引入静态类型系统,提供了更高的类型安全性和更好的工具支持,尤其适合大型团队和复杂项目。本文详细对比了 JavaScript 和 TypeScript 的优缺点,并提供了实际代码示例,帮助开发者根据项目需求选择合适的工具。
1270 2
|
9月前
|
消息中间件 JavaScript 前端开发
最细最有条理解析:事件循环(消息循环)是什么?为什么JS需要异步
度一教育的袁进老师谈到他的理解:单线程是异步产生的原因,事件循环是异步的实现方式。 本质是因为渲染进程因为计算机图形学的限制,只能是单线程。所以需要“异步”这个技术思想来解决页面阻塞的问题,而“事件循环”是实现“异步”这个技术思想的最主要的技术手段。 但事件循环并不是全部的技术手段,比如Promise,虽然受事件循环管理,但是如果没有事件循环,单一Promise依然能实现异步不是吗? 博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您