函数节流在日常的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 函数节流简单测试的更多相关文章

  1. 也谈js函数节流

    1.什么是js函数节流 其本质就是不让某些代码(函数)在没有间断的情况下连续重复执行,目的就是让执行函数的请求停止了一段时间后才执行. 2.函数节流运用的场景 窗口大小的改变(resize事件),滚动 ...

  2. JS函数节流

    背景:在前端开发中,有时会为页面绑定resize事件,或为一个页面元素拖拽事件(其核心就是绑定mousemove)在一个正常操作中也有可能在一个短时间内触发非常多次事件绑定程序,而DOM操作是很消耗性 ...

  3. js 函数节流和防抖

    js 函数节流和防抖 throttle 节流 事件触发到结束后只执行一次. 应用场景 触发mousemove事件的时候, 如鼠标移动. 触发keyup事件的情况, 如搜索. 触发scroll事件的时候 ...

  4. Underscore——JS函数库

    转载请注明原文地址:https://www.cnblogs.com/ygj0930/p/10826065.html underscore是什么——它是一个js函数库 jQuery统一了不同浏览器之间的 ...

  5. 深入理解JS函数节流和去抖动

    一.什么是节流和去抖? 1.节流 节流就是拧紧水龙头让水少流一点,但是不是不让水流了.想象一下在现实生活中有时候我们需要接一桶水,接水的同时不想一直站在那等着,可能要离开一会去干一点别的事请,让水差不 ...

  6. JS函数节流代码实现

    函数被频繁调用场景 Js中的函数大多数情况下都是由用户主动调用触发的,一般不会遇到性能相关的问题.但在一些少数情况下,函数的触发不是由用户直接控制.在这些场景下,函数有可能被非常频繁地调用,而造成大的 ...

  7. 结构-行为-样式-Js函数节流

    最近一个面试官问了我一个函数节流的问题,然后感觉自己工作中遇到过这个问题,但是不知道这种形式就是函数节流.下面我来说下这个Js的高级问题,思路:函数节流就是防止用户高频调用某个事件而做的Js层面的处理 ...

  8. js 函数节流throttle 函数去抖debounce

    1.函数节流throttle 通俗解释: 假设你正在乘电梯上楼,当电梯门关闭之前发现有人也要乘电梯,礼貌起见,你会按下开门开关,然后等他进电梯: 但是,你是个没耐心的人,你最多只会等待电梯停留一分钟: ...

  9. JS函数节流和函数防抖问题分析

    问题1:如果实现了dom拖拽功能,但是在绑定拖拽事件的时候发现每当元素稍微移动一点便触发了大量的回调函数,导致浏览器直接卡死,这个时候怎么办? 问题2:如果给一个按钮绑定了表单提交的post事件,但是 ...

随机推荐

  1. Python的文件类型

    Python的文件类型主要分为3种:源代码(source file).字节码(byte-code file).优化的字节码(optimized file).这些代码都可以直接运行,不需要编译或者连接. ...

  2. Inno Setup的常用脚本

    Inno Setup的常用脚本 分类: VC++神奇理论 2012-12-06 10:07 3234人阅读 评论(2) 收藏 举报 安装不同的目录: [Files] Source: "我的程 ...

  3. SFTP 上传文件夹

    使用sftp上传文件夹时若使用如下命令并不work: put /media/Research/GWAS_Class/* Desktop/ 此时,需要添加一个参数 -r, 另外在目标文件夹下面建立一个同 ...

  4. 关于Highcharts图表组件动态修改属性的方法（API）总结之Series

    Highcharts图表组件内的Series很重要,如果说Categries是其大脑,那么Series就是其心脏.这两者才是Highcharts图表组件的重中之重啊.接下来就为大家介绍关于设置Seri ...

  5. Java 存储过程调用

    //配置文件 private static ClientServiceConfigUtil configUtil = new ClientServiceConfigUtil("/Databa ...

  6. Codeforces Round #111 (Div. 2)

    Codeforces Round #111 (Div. 2) C. Find Pair 题意 给\(N(N \le 10^5)\)个数,在所有\(N^2\)对数中求第\(K(K \le N^2)\)对 ...

  7. GRANT ALL PRIVILEGES 限制某个或所有客户端都可以连接至mysql

    GRANT ALL PRIVILEGES 1. 改表法.可能是你的帐号不允许从远程登陆,只能在localhost.这个时候只要在localhost的那台电脑,登入mysql后,更改 "mys ...

  8. spark1.5引进内置函数

    在Spark 1.5.x版本,增加了一系列内置函数到DataFrame API中,并且实现了code-generation的优化.与普通的函数不同,DataFrame的函数并不会执行后立即返回一个结果 ...

  9. px em rem在WEB前端开发中的区别

    我们都知道基于像素的字体大小所用的单位是px,但是随着响应式设计的不断火热,基于相对字体大小的单位em变开始流行起来.当然,rem也在Web前端开发人员讨论如何更好设置字体大小的讨论话题之列.是不是需 ...

  10. 两篇很牛的vim使用技巧

    读本文之前请注意: 1. 本文的目标是提供一些vim的使用技巧,利用这些技巧可以提高vim的操作效率.部分技巧在vi上也可以使用,但是现在基本上都是用vim了. 2. 本文是整理和总结使用技巧,而非讲 ...