Underscore.js 函数节流简单测试
函数节流在日常的DOM界面数据交互中有比较大的作用,可以减少服务器的请求,同时减少客户端的内存影响
Underscore.js 本省就包含了函数节流的处理函数
_.throttle 和 _.debounce
简单的测试使用如下:
需要使用的类库为jquery 、Underscore
测试的方法为:mousemove 事件
测试页面代码如下:
<!DOCTYPE html >
<html>
<head>
<script src="jquery-1.11.1.min.js" type="text/javascript"></script>
<script src="underscore-min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#infoapp').on('mousemove', alertinfo); 不使用节流方法 // $('#infoapp').on('mousemove', _.throttle(alertinfo, 5000)); 使用节流方法 throttle // $('#infoapp').on('mousemove', _.debounce(alertinfo, 1000, false)); 使用节流方法debounce
}
)
// 进行回调的事件处理函数
function alertinfo() { var data = new Date();
console.log(data);
}
</script>
</head>
<body>
<div id="infoapp" style="background-color: Red; width: 200px; height: 200px; margin:0 auto;">
</div>
</body>
</html>
测试的结果如下:


结论:
总的来说对于我们在密集数据请求的ajax 交互中使用函数节流的方式有很大的帮助,减少了很多的没有必要的数据请求。
Underscore.js 函数节流简单测试的更多相关文章
- 也谈js函数节流
1.什么是js函数节流 其本质就是不让某些代码(函数)在没有间断的情况下连续重复执行,目的就是让执行函数的请求停止了一段时间后才执行. 2.函数节流运用的场景 窗口大小的改变(resize事件),滚动 ...
- JS函数节流
背景:在前端开发中,有时会为页面绑定resize事件,或为一个页面元素拖拽事件(其核心就是绑定mousemove)在一个正常操作中也有可能在一个短时间内触发非常多次事件绑定程序,而DOM操作是很消耗性 ...
- js 函数节流和防抖
js 函数节流和防抖 throttle 节流 事件触发到结束后只执行一次. 应用场景 触发mousemove事件的时候, 如鼠标移动. 触发keyup事件的情况, 如搜索. 触发scroll事件的时候 ...
- Underscore——JS函数库
转载请注明原文地址:https://www.cnblogs.com/ygj0930/p/10826065.html underscore是什么——它是一个js函数库 jQuery统一了不同浏览器之间的 ...
- 深入理解JS函数节流和去抖动
一.什么是节流和去抖? 1.节流 节流就是拧紧水龙头让水少流一点,但是不是不让水流了.想象一下在现实生活中有时候我们需要接一桶水,接水的同时不想一直站在那等着,可能要离开一会去干一点别的事请,让水差不 ...
- JS函数节流代码实现
函数被频繁调用场景 Js中的函数大多数情况下都是由用户主动调用触发的,一般不会遇到性能相关的问题.但在一些少数情况下,函数的触发不是由用户直接控制.在这些场景下,函数有可能被非常频繁地调用,而造成大的 ...
- 结构-行为-样式-Js函数节流
最近一个面试官问了我一个函数节流的问题,然后感觉自己工作中遇到过这个问题,但是不知道这种形式就是函数节流.下面我来说下这个Js的高级问题,思路:函数节流就是防止用户高频调用某个事件而做的Js层面的处理 ...
- js 函数节流throttle 函数去抖debounce
1.函数节流throttle 通俗解释: 假设你正在乘电梯上楼,当电梯门关闭之前发现有人也要乘电梯,礼貌起见,你会按下开门开关,然后等他进电梯: 但是,你是个没耐心的人,你最多只会等待电梯停留一分钟: ...
- JS函数节流和函数防抖问题分析
问题1:如果实现了dom拖拽功能,但是在绑定拖拽事件的时候发现每当元素稍微移动一点便触发了大量的回调函数,导致浏览器直接卡死,这个时候怎么办? 问题2:如果给一个按钮绑定了表单提交的post事件,但是 ...
随机推荐
- vijos 1741 观光公交
TMD这种题有什么意思啊...敲着都烦啊...感觉啥都没有用就敲完了...光考个贪心有什么意思啊. 反正不想写.NOIP遇到了...管他呢. #include<iostream> #inc ...
- swift系统学习控件篇:UIProgressView+NSTimer+UIstepper+UIAlertController
工作之余,学习下swift大法.把自己的学习过程分享一下.当中的布局很乱,就表在意这些细节了.直接上代码: UIProgressView+NSTimer+UIstepper UIStepper UIP ...
- Android弹出选项框及指示箭头动画选择
Android弹出选项框及指示箭头动画选择 Android原生的Spinner提供了下拉列表选项框,但在一些流行的APP中,原生的Spinner似乎不太受待见,而通常会有下图所示的下拉列表选项框 ...
- JavaScript 经常忽略的 7 个基础知识点
1. 在 String.prototype.replace 方法中使用 /g 和 /i标志位 令很多 JavaScript 初学者意外的是,字符串的 replace 方法并不会 替换所有匹配的子串—— ...
- iis6.0+.net 4.0 +mvc 404错误
ps: 在iis中重新注册.net framework命令cd C:\Windows\Microsoft.NET\Framework\v4.0.30319\aspnet_regiis.exe -i 1 ...
- 转:DateTime的灵活运用
//2008年4月24日 System.DateTime.Now.ToString("D"); //2008-4-24 System.DateTime.Now.ToString(& ...
- System.out.println调试输出
Android开发中在代码中通过System.out.println调试输出在Logcat窗口中可以看到. 但Logcat视图中夹杂了太多的其它App及底层的信息,看起来并不明朗.可以在Logcat视 ...
- Examining Open vSwitch Traffic Patterns
In this post, I want to provide some additional insight on how the use of Open vSwitch (OVS) affects ...
- Xen虚拟机磁盘镜像模板制作(一)—Windows Server 2008(2012)
这段时间一直在研究如何制作一个适合Xen虚拟化的Windows Server 2008(2012)磁盘镜像,中间虽然遇到了一些阻挠,不过最终还是顺利解决,成功制作出了Xen Windows Serve ...
- UVa 11246 - K-Multiple Free set
题意大意: 一个{1..n}的集合,求一个子集合,使得元素个数最多,并且不存在有两个元素x * k = y,求出最多的元素个数是多少. 分析: 先要删除k倍的,删除为{k, 2k, 3k, 4k, 5 ...