`
zhwadezheng
  • 浏览: 7209 次
  • 性别: Icon_minigender_1
  • 来自: 珠海
社区版块
存档分类
最新评论

Javascript应注意的性能提升问题

阅读更多

总结了一下平时用得比较普遍的js性能提升方面的注意事项:

1、关于JS的循环,循环是一种常用的流程控制。JS提供了三种循环:for(;;)while()for(in)。在这三种循环中 for(in)的效率最差,因为它需要查询Hash键,因此应尽量少用for(in)循环,for(;;)while()循环的性能基本持平。当然,推荐使用for循环,如果循环变量递增或递减,不要单独对循环变量赋值,而应该使用嵌套的++或--运算符。

2、如果需要遍历数组,应该先缓存数组长度,将数组长度放入局部变量中,避免多次查询数组长度。

3、局部变量的访问速度要比全局变量的访问速度更快,因为全局变量其实是window对象的成员,而局部变量是放在函数的栈里的。

4、尽量少使用eval,每次使用eval需要消耗大量时间,这时候使用JS所支持的闭包可以实现函数模板。

5、尽量避免对象的嵌套查询,对于obj1.obj2.obj3.obj4这个语句,需要进行至少3次查询操作,先检查obj1中是否包含 obj2,再检查obj2中是否包含obj3,然后检查obj3中是否包含obj4...这不是一个好策略。应该尽量利用局部变量,将obj4以局部变量保存,从而避免嵌套查询。

6、使运算符时,尽量使用+=,-=、*=、\=等运算符号,而不是直接进行赋值运算。

7、当需要将数字转换成字符时,采用如下方式:"" + 1。从性能上来看,将数字转换成字符时,有如下公式:("" +) > String() > .toString() > new String()String()属于内部函数,所以速度很快。而.toString()要查询原型中的函数,所以速度逊色一些,new String()需要重新创建一个字符串对象,速度最慢。

8、当需要将浮点数转换成整型时,应该使用Math.floor()或者Math.round()。而不是使用parseInt(),该方法用于将字符串转换成数字。而且Math是内部对象,所以Math.floor()其实并没有多少查询方法和调用时间,速度是最快的。

9、尽量作用JSON格式来创建对象,而不是var obj=new Object()方法。因为前者是直接复制,而后者需要调用构造器,因而前者的性能更好。

10、当需要使用数组时,也尽量使用JSON格式的语法,即直接使用如下语法定义数组:[parrm,param,param...],而不是采用 new Array(parrm,param,param...)这种语法。因为使用JSON格式的语法是引擎直接解释的。而后者则需要调用Array的构造器。

11、对字符串进行循环操作,例如替换、查找,就使用正则表达式。因为JS的循环速度比较慢,而正则表达式的操作是用C写成的API,性能比较好。

12、对于大的JS对象,因为创建时时间和空间的开销都比较大,因此应该尽量考虑采用缓存。

。。。。。。

其它方面的希望各位大虾多多补充!

分享到:
评论

相关推荐

    高性能JavaScript PDF

    **高性能JavaScript PDF**是关于利用JavaScript技术来优化和提升PDF文档处理性能的专业资源。JavaScript作为Web开发中的主要脚本语言,被广泛应用于交互式网页和动态应用。在PDF领域,JavaScript可以用来增强文档的...

    Javascript 性能优化的一点技巧

    ### JavaScript性能优化技巧详解 #### 引言 随着Web应用的日益复杂,JavaScript作为前端开发的核心语言之一,其运行效率直接影响着用户体验与整体性能。...希望本文能够为您的项目带来实质性的性能提升!

    JavaScript性能优化的小知识总结共23页.pdf

    3. **减少DOM操作**:DOM操作是JavaScript性能的瓶颈,尽量避免频繁修改DOM,可以使用文档碎片(DocumentFragment)或批量操作来提升性能。 4. **事件委托(Event Delegation)**:通过在父元素上绑定事件,利用...

    高性能javascript设计

    在JavaScript的世界里,高性能的设计是确保网页应用流畅运行的关键。要理解如何实现高性能JavaScript,我们需要深入探讨以下几个核心知识点: 1. **数据结构与算法选择**:JavaScript中的对象、数组、字符串等都有...

    高性能javascript中英文对照版

    - 第二章 Data Access 数据访问:这部分内容可能会介绍如何减少在JavaScript中访问DOM数据的性能开销,提升数据访问效率。 - 第三章 DOM Scripting DOM编程:章节可能会涉及到与DOM操作相关的性能问题,并介绍...

    JavaScript性能

    为了提升JavaScript性能,开发者需要从多个维度入手,包括但不限于内存管理、代码优化、脚本加载、DOM操作、事件处理以及动画处理等。 首先,JavaScript内存管理是性能优化的基础。在JavaScript中,内存分配通常是...

    Javascript 高性能程序开发(中文版)

    通过这些方法的应用,开发者能够更好地管理脚本的加载和执行,以及合理地控制作用域,从而提升JavaScript代码的运行效率,减少页面加载时间,最终为用户提供更优质的浏览体验。本书不仅适合初学者,也适合有一定基础...

    自己写的javascript性能测试插件

    通过自定义JavaScript性能测试插件,开发者能够对代码进行深入分析,找出性能瓶颈,并采取针对性的优化措施,提升Web应用的整体性能和用户体验。`t1.html`和`PerformanceTest.js`的结合使用,为我们提供了一个完整的...

    javascript Tree效果

    "很炫"一词暗示了这个框架在视觉呈现上可能有出色的表现,比如动画过渡、颜色效果等,以吸引用户的注意力并提升用户体验。 标签中的"Tree"指的是树形结构,这是计算机科学中一种常见的数据表示方式,由节点和连接...

    JavaScript性能优化的小知识总结共23页.pdf.zip

    13. **使用最新的JavaScript语法特性**:比如`let`和`const`代替`var`,`class`代替传统的构造函数,这些新特性往往能带来性能提升。 14. **避免DOM查询**:尽可能减少对`document.querySelector`和`document....

    JavaScript与ActionScript3交互问题总结

    JavaScript与ActionScript3交互问题总结 在Web开发中,JavaScript是一种广泛使用的客户端脚本语言,而ActionScript3(AS3)则是Adobe Flash...在实际项目中,应根据需求选择合适的交互方式,同时注意性能和兼容性。

    javascript刷题讲义.rar

    通过LeetCode的练习,不仅可以巩固JavaScript的基础,还能提升解决问题的能力。在刷题过程中,注意理解和分析题目的意图,设计出高效且易于维护的解决方案,这对任何开发者来说都是宝贵的锻炼。同时,不断总结和归纳...

    JavaScript语言精粹pdf

    12. **安全问题**:JavaScript编程也需要注意一些安全问题,如XSS(跨站脚本攻击)和CSRF(跨站请求伪造)的防范。 通过阅读《JavaScript语言精粹》,读者不仅能掌握JavaScript的基本语法和高级特性,还能了解到...

    javascript合集

    JavaScript,是一种广泛应用于网页和网络应用的脚本语言,它主要负责实现客户端的交互效果,增强用户界面。...无论是初学者还是经验丰富的开发者,都能从中受益匪浅,不断提升自己的JavaScript技术水平。

    提升网页性能:HTML5 Web Workers的深入应用与代码实践

    HTML5 Web Workers作为一种在浏览器后台线程中执行JavaScript代码的技术,为提升页面性能提供了有力支持。通过合理应用Web Workers,开发者可以优化数据处理、复杂计算和长时间运行任务等场景的性能表现,从而提升...

    JavaScript与MATLAB的计算性能差异对比研究.zip

    例如,可以编写 JavaScript 和 MATLAB 版本的矩阵乘法、傅里叶变换或最优化问题求解算法,然后对比它们的运行速度。需要注意的是,由于环境因素,如硬件、内存管理以及编译优化,结果可能有所差异。 JavaScript ...

    Effective JavaScript 编写高质量JavaScript代码的68个有效方法1

    该书基于作者在Ecma的JavaScript标准化委员会的工作经验,深入探讨了JavaScript的内部工作机制、特性和最佳实践,旨在帮助开发者提升代码质量。书中包含7个章节,覆盖了JavaScript的多个关键领域。 第一章主要涉及...

    javascript特效大全手册

    《JavaScript特效大全手册》是一本全面涵盖JavaScript特效的资源集合,包含了1500个不同的JavaScript特效实例,...在实际应用中,开发者应根据项目需求选择合适的特效,并注意性能优化,以提供流畅且美观的用户体验。

Global site tag (gtag.js) - Google Analytics