js-JavaScript高级程序设计学习笔记21 改善JavaScript性能的方法

Posted 2020-08-24 ZhangCui

第24章 最佳实践

1、性能

1、避免全局查找

将在一个函数中会用到多次的全局对象保存在局部变量。比如多次使用document.getElement。。。，可以首先var doc=document，把document对象保存在本地的doc变量中。

2、避免with语句。

with会创建自己的作用域，需要额外的作用域链查找

3、避免不必要的属性查找

如果需要多次用到对象属性，应该将其存储在局部变量中。

4、优化循环

减值迭代更快，优化循环体

5、展开循环

循环次数确定时，消除循环更快。Duff装置的基本概念是将循环展开。

6、避免双重解释

JS解析字符串代码时需要启动解析器，慢

7、其他

①原生方法较快。因为使用C/C++等编译型语言写的

②Switch语句较快。比if-else语句更快。

③位运算符较快。

8、最小化语句

①多个变量声明组合

②插入迭代值，比如var name=values[i++];

③使用数组和对象字面量，比使用构造函数好

9、优化DOM交互

①最小化现场更新，比如使用DOM多次插入元素，可以先创建文档片段，之后将片段插入，只进行一次现场更新。

②使用innerhtml，比JS创建DOM结构更快。应构建好内容后一次性调用innerHTML，避免多次innerHTML。

③使用事件委托，利用事件冒泡，减少页面上的事件处理程序。

④注意HTMLCollection对象。避免多次调用，它是动态的，每次调用需要进行一次文档查询！

以下情况会返回HTMLCollection对象

• 进行了对getElementsByTagName的调用
• 获取了元素的childNodes属性
• 获取了元素的attributes属性
• 访问了特殊的集合，如document.forms/document.images等。