高性能WEB开发：Javascript自身执行效率

短暂又灿烂的

于 2021-10-07 20:40:00 发布

阅读量301

点赞数

分类专栏：前端优化方案文章标签： javascript html css

本文链接：https://blog.csdn.net/weixin_42232156/article/details/120525788

版权

优化方案同时被 2 个专栏收录

38 篇文章 1 订阅 ¥59.90 ¥99.00

订阅专栏

超级会员免费看

前端

266 篇文章 11 订阅

订阅专栏

本文探讨了JavaScript中影响执行效率的因素，包括全局变量的使用、eval及类似eval的场景、闭包管理和DOM操作。提出了优化建议，如局部变量缓存全局对象、避免eval、及时释放闭包中的变量、减少DOM操作引起的重绘和回流、使用事件委托等，以提升JavaScript代码性能。

摘要由CSDN通过智能技术生成

　Javascript中的作用域链、闭包、原型继承、eval等特性，在提供各种神奇功能的同时也带来了各种效率问题，用之不慎就会导致执行效率低下。

1、全局导入

　　我们在编码过程中多多少少会使用到一些全局变量（window、document、自定义全局变量等等），了解javascript作用域链的人都知道，在局部作用域中访问全局变量需要一层一层遍历整个作用域链直至顶级作用域，而局部变量的访问效率则会更快更高，因此在局部作用域中高频率使用一些全局对象时可以将其导入到局部作用域中，例如：

//1、作为参数传入模块
(function(window,$){
    var xxx = window.xxx;
    $("#xxx1").xxx();
    $("#xxx2").xxx();
})(window,jQuery);
 
//2、暂存到局部变量
function(){
    var doc = document;
    var global = window.global;
}

2、eval以及类eval问题

　　我们都知道eval可以将一段字符串当做js代码来执行处理，据说使用eval执行的代码比不使用eval的代码慢100倍以上（具体效率我没有测试，有兴趣同学可以测试一下࿰