您现在的位置：首页 --> JavaScript --> window resize和scroll事件的基本优化
window resize和scroll事件的基本优化
浏览:1902次 出处信息
同事在项目中使用scroll事件去加载数据，结果IE下悲剧了。给了一个简单优化方法，效果明显。
只要用户改变窗口大小，会对内部一些元素大小重新计算，可能导致整个页面重新渲染，最终导致大量消耗 CPU。比如调用 resize 方法，用户改变窗口大小时会不停的被触发， 低版本的IE 会可能陷入假死状态。window的scroll事件也是如此，鼠标滚动或拖动滚动条，就会不停的触发scroll事件，如果处理的东西多，低版本的IE也会陷入假死状态。
基本的优化思路：在一定的时间之内，只执行一次resize事件函数。
var resizeTimer = null;
$(window).on('resize', function () {
if (resizeTimer) {
clearTimeout(resizeTimer)
}
resizeTimer = setTimeout(function(){
console.log("window resize");
}, 400);
}
);scroll事件优化同理。
建议继续学习：
QQ技术交流群：445447336，欢迎加入！
扫一扫订阅我的微信号：IT技术博客大学习
扫一扫订阅我的微信号：IT技术博客大学习
<< 前一篇：Javascript中的delete操作符
后一篇：JavaScript中双叹号(!!)作用 >>
文章信息
- 作者：愚人码头 来源： WEB前端开发
- 标签： resize scroll
- 发布时间：2014-11-27 12:53:35
近3天十大热文
-
[1182] WordPress插件开发 -- 在插件使用 -
[74] 解决 nginx 反向代理网页首尾出现神秘字
-
[43] web开发设计人员不可不用的在线web工具和
-
[38] Java开发岗位面试题归类汇总
-
[31] 一句话crontab实现防ssh暴力破解
-
[31] Rax 系列教程（长列表）
-
[30] 手机产品设计方向
-
[27] 程序员疫苗：代码注入
-
[27] 如何建立合适的索引？
-
[26] oracle技术方面的路线
