JS 提高性能

1. 循环每次迭代时，坏代码就会访问数组的 length 属性。
   好代码在循环之外访问 length 属性，使循环更快。

//好的代码
var i;
var len = arr.length;
for (i = 0; i < len; i++) {

2. HTML DOM操作很慢，

• 减少DOM操作，将其转化为本地变量

var obj;
obj = document.getElementById("demo");
obj.innerHTML = "Hello"; 

• 缩小DOM树规模，提高DOM操作的效率

3. 不要创建不打算存储值的新变量
4. js在下载时，浏览器会陷入等待；

• 把脚本放在页面底部，延迟js的加载
• 在 script 标签中使用 defer=“true”。defer 属性规定了脚本应该在页面完成解析后执行
• 在页面完成加载后，通过代码向页面添加脚本

window.onload = downScripts;

function downScripts() {
    var element = document.createElement("script");
    element.src = "myScript.js";
    document.body.appendChild(element);
}

5. 避免使用 with 关键字
   对速度有负面影响，也将混淆 JavaScript 作用域。
   严格模式中不允许 with 关键词。

减少HTTP请求

减少重绘和回流

网页性能检测
https://web.dev/vitals/