window resize和scroll事件的基本优化思路


Posted in Javascript onApril 29, 2014

同事在项目中使用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事件优化同理。
Javascript 相关文章推荐
jqPlot Option配置对象详解
Jul 25 Javascript
JavaScript中如何通过arguments对象实现对象的重载
May 12 Javascript
jQuery前端框架easyui使用Dialog时bug处理
Dec 05 Javascript
Python脚本后台运行的几种方式
Mar 09 Javascript
使用jquery制作弹出框效果
Apr 03 Javascript
举例讲解JavaScript substring()的使用方法
Nov 09 Javascript
跟我学习javascript的循环
Nov 18 Javascript
Javascript中判断一个值是否为undefined的方法详解
Sep 28 Javascript
用jquery的attr方法实现图片切换效果
Feb 05 Javascript
angularjs通过过滤器返回超链接的方法
Oct 26 Javascript
vue+node实现图片上传及预览的示例方法
Nov 22 Javascript
谈谈JavaScript中super(props)的重要性
Feb 12 Javascript
js父窗口关闭时子窗口随之关闭完美解决方案
Apr 29 #Javascript
JS截取url中问号后面参数的值信息
Apr 29 #Javascript
javascript类型转换示例
Apr 29 #Javascript
常见浏览器多长时间会提示“脚本运行时间过长”总结
Apr 29 #Javascript
javascript中使用正则计算中文长度的例子
Apr 29 #Javascript
一个简单的Node.js异步操作管理器分享
Apr 29 #Javascript
IE浏览器中图片onload事件无效的解决方法
Apr 29 #Javascript
You might like
在JavaScript中调用php程序
2009/03/09 PHP
php封装的smarty类完整实例
2016/10/19 PHP
jQuery库与其他JS库冲突的解决办法
2010/02/07 Javascript
ExtJS4 组件化编程,动态加载,面向对象,Direct
2011/05/12 Javascript
js综合应用实例简单的表格统计
2013/09/03 Javascript
js中cookie的添加、取值、删除示例代码
2013/10/21 Javascript
JS二维数组的定义说明
2014/03/03 Javascript
JavaScript实现的一个倒计时的类
2015/03/12 Javascript
jquery实现弹出层效果实例
2015/05/19 Javascript
javascript实现类似java中getClass()得到对象类名的方法
2015/07/27 Javascript
Angularjs中controller的三种写法分享
2016/09/21 Javascript
JS中闭包的经典用法小结(2则示例)
2016/12/28 Javascript
详解如何去除vue项目中的#——History模式
2017/10/13 Javascript
[01:02:05]LGD vs Mineski 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
Python中xrange与yield的用法实例分析
2017/12/26 Python
python实现读取大文件并逐行写入另外一个文件
2018/04/19 Python
Python合并多个Excel数据的方法
2018/07/16 Python
Python 文本文件内容批量抽取实例
2018/12/10 Python
python3中sorted函数里cmp参数改变详解
2020/03/12 Python
Python绘制全球疫情变化地图的实例代码
2020/04/20 Python
python爬虫智能翻页批量下载文件的实例详解
2021/02/02 Python
John Varvatos官方网站:设计师男士时装
2017/02/08 全球购物
法国购买二手电子产品网站:Asgoodasnew
2020/03/27 全球购物
中学家长会邀请函
2014/01/17 职场文书
2014年清明节寄语
2014/04/03 职场文书
煤矿安全生产责任书
2014/04/15 职场文书
2013年最新自荐信范文
2014/06/23 职场文书
学生会竞选演讲稿怎么写
2014/08/26 职场文书
2014年中秋节活动总结
2014/08/29 职场文书
说谎欺骗人检讨书300字
2014/11/18 职场文书
2014年德育工作总结
2014/11/20 职场文书
教师个人教学总结
2015/02/11 职场文书
社区党务工作总结2015
2015/05/19 职场文书
体育教师研修感悟
2015/11/18 职场文书
职场新人知识:如何制定一份合理的工作计划?
2019/09/11 职场文书
my.ini优化mysql数据库性能的十个参数(推荐)
2021/05/26 MySQL