JavaScript性能

最新推荐文章于 2024-09-11 15:33:18 发布

Azir_Miao

最新推荐文章于 2024-09-11 15:33:18 发布

阅读量126

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/weixin_45375895/article/details/104860672

版权

一、减少循环中的活动

在使用循环语句时，先获取length属性，再循环

var l = array.length
for (let i = 0; i < length; i++) {
    
}

二、减少DOM访问

JavaScript访问HTML DOM速度较慢
可以直接把某个DOM元素赋值给变量来使用

var box = document.querySelector('.box')
box.innerHTML = '盒子'

三、缩减DOM规模

尽量保持 HTML DOM 中较少的元素数量，这样可以提高页面加载，并加快渲染（页面显示），尤其是在移动端设备上
每一次搜索DOM都将受益于一个较小的DOM

四、避免不必要的变量

减少不必要的变量声明，每声明一个变量，会在栈内存中开辟一块空间，影响运行速度

五、JavaScript加载位置

一般JavaScript在页面加载完成后，在向页面添加js文件
JavaScript文件在下载时，浏览器不会启动任何其他的下载。此外所有解析和渲染活动都可能会被阻塞。HTTP 规范定义浏览器不应该并行下载超过两种要素。

六、声明变量的位置

尽量在每个作用域的顶部声明变量
代码更整洁
更容易查找局部变量
更容易避免不需要的全局变量
避免重复声明变量
变量提升是JavaScript解释代码的方式，如果不注意变量提升，可能会导致程序报错

七、尽量避免全局变量

尽量少的使用全局变量，包括所以的数据类型，对象和函数，全局变量和函数很可能被引入的其他JavaScript变量覆盖
尽量使用局部变量和闭包

八、初始化变量

在变量时对其进行初始化。
更整洁的代码
在单独的位置来初始化变量
避免未定义值

九、变量声明

尽量不要用构造函数的方式声明数字，布尔，字符串，如果把这些类型声明为对象，会拖慢运行速度

var a = 1
var b = new Number(1)
console.log(a===b); //false,a是数字型，b是对象类型

var x = new String('你好')
var y = new String('你好')
console.log(x==y)  //false,对象无法比较大小

十、请勿使用new Object()

使用 {} 来代替 new Object()
使用 “” 来代替 new String()
使用 0 来代替 new Number()
使用 false 来代替 new Boolean()
使用 [] 来代替 new Array()
使用 / / 来代替 new RegExp()
使用 function (){}来代替 new Function()

var x1 = {};           // 新对象
var x2 = "";           // 新的原始字符串值
var x3 = 0;            // 新的原始数值
var x4 = false;        // 新的原始布尔值
var x5 = [];           // 新的数组对象
var x6 = /()/;         // 新的正则表达式
var x7 = function(){}; // 新的函数对象