在一些开发场景中,我们可能会一次性向文档中注入上千个节点,在短时间内向浏览器中大量添加DOM节点可能会让浏览器吃不消,结果往往会让浏览器卡顿或吃不消,解决方案之一便是使用分时函数(timeChunk)。

timeChunk函数让创建节点的工作分批进行,比如一秒钟创建1000个节点,改为每个200ms创建10个节点。具体timeChunk函数封装如下

function timeChunk( arr, fn, count){//arr 数组 fn操作函数 count每次操作数量
var obj,
t;
var start = function(){
var len = Math.min(count||1,arr.length);
for(var i=0; i < len; i++){
obj = arr.shift();
fn(obj)
}
};
return function(interval){
t = setInterval(function(){
if(arr.length==0){
return clearInterval(t)
};
start();
},interval||200)
}
}

应用实例见https://92node.com/article/js-fen-shi.html

javascript之分时函数的更多相关文章

  1. JavaScript高阶函数的应用

    定义 高阶函数是指至少满足下列条件之一的函数: 函数可以作为参数被传递: 函数可以作为返回值输出. JavaScript语言中的函数显然满足高阶函数的条件,在实际开发中,无论是将函数当作参数传递,还是 ...

  2. JavaScript中的函数:闭包,this,高阶函数

    一.函数基本理论 function compare(val1,val2){ return val1 - val2; }var result = compare(5,10); 1,函数的定义没什么意义, ...

  3. 分时函数 & 节流函数

    分时函数 & 节流函数 1.函数节流 JavaScript 中的函数大多数情况下都是由用户主动调用触发的,除非是函数本身的实现不合 理,否则我们一般不会遇到跟性能相关的问题.但在一些少数情况下 ...

  4. JavaScript权威指南 - 函数

    函数本身就是一段JavaScript代码,定义一次但可能被调用任意次.如果函数挂载在一个对象上,作为对象的一个属性,通常这种函数被称作对象的方法.用于初始化一个新创建的对象的函数被称作构造函数. 相对 ...

  5. 用javascript 写个函数返回一个页面里共使用了多少种HTML 标签

    今天我无意间看到一个面试题: 如何用javascript 写个函数返回一个页面里共使用了多少种HTML 标签? 不知你看到 是否蒙B了,如果是我 面试,肯定脑子嗡嗡的响.... 网上搜了搜也没有找到答 ...

  6. JavaScript基础学习-函数及作用域

    函数和作用域是JavaScript的重要组成部分,我们在使用JavaScript编写程序的过程中经常要用到这两部分内容,作为初学者,我经常有困惑,借助写此博文来巩固下之前学习的内容. (一)JavaS ...

  7. JavaScript 基础回顾——函数

    在JavaScript中,函数也是一种数据类型,属于 function 类型,所以使用Function关键字标识函数名.函数可以在大括号内编写代码并且被调用,作为其他函数的参数或者对象的属性值. 1. ...

  8. JavaScript正则表达式详解(二)JavaScript中正则表达式函数详解

    二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...

  9. javascript立即执行函数

    javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花;当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解.  ( ...

随机推荐

  1. INSERT高级应用

    INSERT INTO departments VALUES (departments_seq.nextval, 'Entertainment', 162, 1400); INSERT INTO em ...

  2. KM算法(最优匹配)

    hdu2255 奔小康赚大钱 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) T ...

  3. Oracle管理监控之使用utl_mail自动邮件报警配置

    --代发邮件存储过程源码如下: CREATE OR REPLACE PROCEDURE send_mail(p_recipient VARCHAR2, -- 邮件接收人                 ...

  4. 数据去重优化 MemoryError 内存不足

    from ProjectUtil.usingModuleTOMODIFY import getNow export_q_f, q_l, start_ = '/mnt/mongoexport/super ...

  5. pandas 取消读取csv时默认第一行为列名

    读取时默认第一行为列名 此时DataFrame的列名为第一行数据: 因为第一行为有效数据,故不可作为列名,要么重新起列名,要么使用默认序列列名: 取消默认第一行为列名 给 pd.read_csv() ...

  6. CSS之Flex 布局:语法篇

    网页布局(layout)是 CSS 的一个重点应用. ​ 布局的传统解决方案,基于盒状模型,依赖 display 属性 + position属性 + float属性.它对于那些特殊布局非常不方便,比如 ...

  7. 设置UCHome注册登陆退出的跳转页自定义

    UCHome 默认注册.登录成功后跳转到 http://www.xxx.com/home/space.php?do=home 退出后会跳转到站点的首页,即 http://www.xxx.com/hom ...

  8. 第1章 1.3计算机网络概述--规划IP地址介绍MAC地址

    IP地址的作用是:指定发送数据者和接收数据者. MAC地址的作用:指定数据包的下一跳转设备.就是说明数据下一步向谁发. 路由器的作用:在不同的网段中转发数据.路由器本质就是有2个网卡的设备. 网卡:用 ...

  9. (2.5)DDL增强功能-触发器trigger

    SQL Server:触发器详解   1. 概述 2. 触发器的分类 3. Inserted和Deleted表 4. 触发器的执行过程 5. 创建触发器 6. 修改触发器: 7. 删除触发器: 8. ...

  10. python 面向对象 公有属性

    公有属性定义  公有属性也叫作类变量  静态字段 class role(): # 传参数 # 公有属性都在这里定义 # 在类里直接定义的属性即是公有属性 nationality = 'JP' def ...