mousemove,scroll,resize性能优化

标签： mousemove scroll resize | 发表时间：2012-08-30 19:40 | 作者：g125989100
出处：http://blog.csdn.net
mousemove,scroll,resize 每秒触发N次 ... 性能优化一下很有必要 
<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="utf-8">
	<title></title>
	<style type="text/css">
	*{margin:0; padding:0;}
	body{height:2000px; font:700 16px/32px '微软雅黑'; color:#fff}
	#before,#after{width:50%; height:100%; text-align:center;}
	#before{float:left; background-color:#0000FF; } 
	#after{float:right; background-color:#FF0000;}
    </style>
	<script type="text/javascript">
	var i = 0,j = 0;
	window.addEventListener('load',function(){
		var before = document.getElementById('before');
		var after = document.getElementById('after');
		//优化
		(function(){
			var me = arguments.callee;
			before.addEventListener('mousemove',function(e){
				i+=1;
				before.innerHTML = '优化后：' + e.type + ':' + i ;
				before.removeEventListener('mousemove',arguments.callee);
				window.setTimeout(function(){
					me();
				},300); //300毫秒执行一次
			});
		})();
		//未优化
		(function(){
			var me = arguments.callee;
			after.addEventListener('mousemove',function(e){
				j+=1;
				after.innerHTML = '优化前' + e.type + ':' + j ;
			});
		})();
	});
	</script>
</head>
<body>
<div id="msg"></div>
    <div id="before"></div>
    <div id="after"></div>
</body>
</html>

作者：g125989100 发表于2012-8-30 19:40:31 原文链接
阅读：1 评论：0 查看评论

相关 [mousemove scroll resize] 推荐：

mousemove,scroll,resize性能优化

- - CSDN博客推荐文章
mousemove,scroll,resize 每秒触发N次. 性能优化一下很有必要 . body{height:2000px; font:700 16px/32px '微软雅黑'; color:#fff}. before.innerHTML = '优化后：' + e.type + ':' + i ;.

Android 区别普通Touch方法和Scroll

- - ITeye博客
    今天想实现这个功能，但只是利用现有的onTouchEvent和GestureDetector感觉做起来有些纠结，原来好像也尝试过，最后搞的程序有点乱，不好维护，那么就利用一下Android程序员最大的优势——源码.     首先想到的ListView既支持点击又支持拖动，就去看源码，首先找的突破点就是:.

跨浏览器resize事件分析

- - CSDN博客Web前端推荐文章
window一次resize事件：. IE7 触发3次, IE8 触发2次, IE9 触发1次, IE10 触发1次. window resize时，部分组件需要重置大小（一次）；部分组件不需要重置大小；. 优点：分Debounced和Throttled两种类型，类型明确. 大多数场景使用jquery-smartresize的Debounced即可满足一次调用即可.