JS性能之setTimeout与clearTimeout

【JS性能之setTimeout与clearTimeout】的更多相关文章

JS性能之setTimeout与clearTimeout

测试环境: chrome浏览器结论: 1 一个页面用setTimeout越多,该页面消耗的内存就会越多,几乎成正比. 2 在'startCount(1000000);-->100万'情况下,不管是每次都调用clearTimeout函数,还是不调用,结果都差不多,所以暂时不知道clearTimeout的真正作用. //================================== 具体代码如下所示-->>startCount(1000000); --(可通过修改传入参数进行对比分析…

JS window对象取消计时器clearTimeout() setTimeout()和clearTimeout()一起使用，停止计时器。语法: clearTimeout(id_of_setT

取消计时器clearTimeout() setTimeout()和clearTimeout()一起使用,停止计时器. 语法: clearTimeout(id_of_setTimeout) 参数说明: id_of_setTimeout:由 setTimeout() 返回的 ID 值.该值标识要取消的延迟执行代码块. 下面的例子和上节的无穷循环的例子相似.唯一不同是,现在我们添加了一个 "Stop" 按钮来停止这个计数器: <!DOCTYPE HTML> <html>…

结合setTimeout和clearTimeout，实现“返回顶部”的功能

结合setTimeout和clearTimeout,当页面停止滚动时,“返回顶部”按钮淡隐淡出.点击“返回顶部”页面以动画形式返回顶部.完美兼容ie6-11,firefox,chrome等. html代码如下: <a href="javascript:void(0)" id="backToTop" class="backToTop">ToTop</a> css代码如下: html {_background: url(abo…

利用setTimeOut 和clearTimeOut 方法控制写一个滑动导航显示不同信息的效果

效果如图鼠标滑动导航下边显示不同效果 html代码和css格式代码 <body><div id="tab" class="tab"> <div class="tab-title" id="tab-title"> <ul> <li class="select" data-flag="0"><a href="#&…

js 性能优化篇一

JS性能优化摘自:http://www.china125.com/design/js/3631.htm 首先,由于JS是一种解释型语言,执行速度要比编译型语言慢得多.(注:,Chrome是第一款内置优化引擎,将JS编译成本地代码的浏览器,其它浏览器也陆续实现了JS的编译过程.但是,即使到了编译执行JS的新阶段,仍然会存在低效率的代码.)以下总结一些可以改进代码的整体性能的方法. 1.注意作用域记住一点,随着作用域中的作用域数量的增加,访问当前作用域以外的变量的时间也在增加.所以,访…

JS动画三剑客——setTimeout、setInterval、requestAnimationFrame

一.前言前端实现动画效果主要有以下几种方法:CSS3中的transition 和 animation ,Javascript 中可以通过定时器 setTimeout.setinterval,HTML5 canvas,HTML5提供的requestAnimationFrame.本文主要分析setTimeout.setinterval.requestAnimationFrame三者的区别和他们各自的优缺点.在了解他们三个之前,我们先来看看一些相关概念. 二.相关概念介绍 1.屏幕刷新频率即图像在…

js性能优化-事件委托

js性能优化-事件委托考虑一个列表,在li的数量非常少的时候,为每一个li添加事件侦听当然不会存在太多性能方面的问题,但是当列表非常的长,长到上百上千甚至上万的时候(当然只是一个解释,实际工作中很少遇到这么多li的情况),为每个li添加事件侦听就会对页面性能产生很大的影响. 就像下面这段代码: <!DOCTYPE HTML><html><head><meta charset="utf-8" /><title>js性能优化&l…

客户端JS性能的一些优化的小技巧

下面是一些关于客户端JS性能的一些优化的小技巧:1.[顶]关于JS的循环,循环是一种常用的流程控制.JS提供了三种循环:for(;;). while().for(in).在这三种循环中 for(in)的效率最差,因为它需要查询Hash键,因此应尽量少用for(in)循环,for(;;).while()循环的性能基本持平.当然,推荐使用for循环,如果循环变量递增或递减,不要单独对循环变量赋值,而应该使用嵌套的++或--运算符.2.如果需要遍历数组,应该先缓存数组长度,将数组长度放入局部变量中,…

settimeout，cleartimeout的使用分析

设置时间的定时轮回执行,大家想到的js也就是settimeout这个方法,这个方法确实能够实现定时反复执行的功能,clearttimeout这是清理或者是暂停轮回执行的情况.可是发现clearttimeout清理不了上次执行的settimeout句柄,到底怎么回事,是clearttimeout方法不好使?带着这个问题,我开始翻阅今天编写的代码,在js中,settimeout方法会返回一个int类型的数据,俗成为定时器编号或者ID,这个编号能够标识改定时器的唯一性,clearttimeout则用该…

js 性能基准测试工具-告别可能、也许、大概这样更快更省

平时写js经常遇到这样做是不是更快点?但又没有具体简单可测试的工具,最近也倒序看博客园司徒正美 js分类下的文章 [ps:去年灵光一闪,发现看博客园排名前100的博客.按照文章分类倒序看是学习最快的方式 O(∩_∩)O~] 看到这篇文章时 (转)Google Closure: 糟糕的JavaScript http://www.cnblogs.com/rubylouvre/archive/2009/12/07/1615593.html 文中有些性能优化对比的举例,让我想起去年我寻找js性能基准测…

js里的setTimeout和setInterval之后的页面是空白,阻塞浏览器的document对象，但是不阻塞script方法

js里的setTimeout和setInterval是否进程阻塞? 阻塞浏览器的document对象,但是不阻塞script方法当你在setTimeout中使用document.write时是不行的,但是可以setTimeout中调任何方法,而且可以多调用 .这样可能会导致setTimeout之后的页面元素不能输出,页面显示不全,页面空白. 建议搜索一下:settimeout异步…

关于javascript中setTimeout()和clearTimeout()的疑惑。

由于在w3school中学习javascript时,当学到setTimeout()和clearTimeout()方法时.根据它所提供的例子(下面的代码转自w3cschool)—计数程序,发现当你不停的点击开始计数得到button, 计数将会加快,给我的感觉是同时运行好几个计数方法,但是我所不清楚的是这几个方法是同步执行还是异步执行.此时,如果你想要停止setTimeout()方法,你需点击停止button的次数与你点击开始计数button的次数相同. 我觉着这里怎么同步和异步机制都可以解释.希望…

js性能的进阶

为了说明js性能方面的差异用一个简单的例子说明下, <style> #ul1{ padding: 5px; overflow: hidden; } #ul1 li{ list-style: none; width: 15px; height: 15px; border-radius: 50%; background: #ccc; margin: 3px; float: left; cursor: pointer; } #ul1 .active{ background: red; } </…

你不知道的Node.js性能优化，读了之后水平直线上升

本文由云+社区发表 "当我第一次知道要这篇文章的时候,其实我是拒绝的,因为我觉得,你不能叫我写马上就写,我要有干货才行,写一些老生常谈的然后加上好多特技,那个 Node.js 性能啊好像 Duang~ 的一下就上去了,那读者一定会骂我,Node.js 根本没有这样搞性能优化的,都是假的." ------ 斯塔克·成龙·王 1.使用最新版本的 Node.js 仅仅是简单的升级 Node.js 版本就可以轻松地获得性能提升,因为几乎任何新版本的 Node.js 都会比老版本性能更好,为什么…

js 性能优化利器：prepack

1. js 性能优化 js 本身是没有像 python 一样的预编译功能,更没有像 java 一样的编译功能,所以,这里所说的 js 代码预编译只是通过工具实现的类似功能而已. 这就要提到 prepack 了,它的思路大致是这样: 把不依赖外部环境的逻辑提前进行运算,并把运算结果替换到相应的源码处,然后从源码中移除这段逻辑. 2. prepack 2.1 安装 2.2 编译(打印在命令行) 2.3 编译后输出文件 2.4 示例源代码编译后的代码 2.5 配合构建工具一起使用 prepack…

JavaScript--定时器setTimeout()、clearTimeout(var param)和setInterval()、clearInterval(var param)

1.setTimeout().clearTimeout(var param) setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,只调用一次 clearTimeout() 方法可取消由 setTimeout() 方法设置的定时操作,参数必须是由 setTimeout() 返回的 ID 值 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>…

我之理解---计时器setTimeout 和clearTimeout

今天在写个图片切换的问题有动画滞后的问题,才动手去查setTimeout 和clearTimeout.之前写的图片播放器也有类似的问题,有自动start按钮和stop按钮, 其他都正常,问题出在每次多次快速的点击start按钮时,图片播放的速度会变块很多,而且没有规律.当时也没有去想这个问题,直到今天遇到了类似的问题才决定去一探究竟. 列举个简单累加例子: <!DOCTYPE HTML> <html> <head> <meta http-equiv=&quo…

js性能优化文章集锦

总结的js性能优化方面的小知识http://www.it165.net/pro/html/201503/35336.html 如何优化你的JS代码http://www.php100.com/html/webkaifa/javascript/2012/0619/10568.html 我所经历的JS性能优化http://www.cnblogs.com/koking/archive/2011/10/17/2215665.html DOM性能瓶颈与Javascript性能优化http://www.cnb…

js性能优化之函数节流(分流函数)

函数节流的原理比如我们在window.onresize事件中要打印当前浏览器窗口的大小,在我们通过拖拽来改变窗口大小时候,打印窗口大小这个工作1s就运行了10次.而实际上我们只需要2次或者3次. 比如这行代码 window.onresize = function() { console.log(1); } 分流函数实现的思路实现的思路就是将即将被执行的函数用setTimeout延迟一段时间再执行.如果该次执行还没有完成,则忽略下面调用该函数的请求. 因此这个节流函数有两个参数,一个是需要被执…

asp.net类似于js中的setTimeOut()的函数作用?

asp.net类似于js中的setTimeOut()的函数作用? 插入这行即可,定时2秒,再运行下一步: System.Threading.Thread.Sleep(); 加个随机数 Random ran = new Random(); , ); System.Threading.Thread.Sleep(RandKey);…

setInterval()、clearInterval()、setTimeout()和clearTimeout()js计数器方法

原文地址:http://caibaojian.com/setinterval-settimeout.html window.setInterval()方法介绍周期性地调用一个函数(function)或者执行一段代码. 语法 var intervalID = window.setInterval(func, delay[, param1, param2, ...]); var intervalID = window.setInterval(code, delay); 这里 intervalID…

node.js之setTimeout()、clearTimeout()与 setInterval()与clearInterval()

1.setTimeout函数与clearTimeout函数 setTimeout(cb,ms,[arg],[...])延时一定时间执行回调函数该函数中cb参数为必填函数,为需要执行的回调函数ms为经过多少毫秒后执行回调函数从第三个参数开始为需要向回调函数中传入的参数 clearTimeout(cb)取消setTimeout中回调函数的调用,参数只能为setTimeout中的所返回的定时器对象 2.setInterval函数与clearInterval函数 setInterval(cb,ms,[a…

js中setTimeout和clearTimeout的使用

setTimeout,延迟n秒后执行指定代码 clearTimeout,清除计时器 <html> <head> <script type="text/javascript"> var t function timedCount() { document.getElementById('txt').value=c c=c+ t=setTimeout() } function stopCount() { clearTimeout(t) } </sc…

JS之setTimeOut与clearTimeOut

小练习1:针对HTML,分别使用 setTimeout 和 setInterval 实现以下功能: 点击按钮时,开始改变 fade-obj 的透明度,开始一个淡出(逐渐消失)动画,直到透明度为0 在动画过程中,按钮的状态变为不可点击在动画结束后,按钮状态恢复,且文字变成“淡入” 在按钮显示淡入的状态时,点击按钮,开始一个“淡入”(逐渐出现)的动画,和上面类似按钮不可点,直到透明度完全不透明淡入动画结束后,按钮文字变为“淡出” 暂时不要使用 CSS animation (以后我们再学习)…

setInterval()、clearInterval()、setTimeout()和clearTimeout() js计数器方法（还有第三个参数）

用法是会用,但是之前一直以为接函数的 var a = setInterval(function(){},1000) 比如a是函数名,最近才发现它是一个ID, var intervalID = window.setInterval(code, delay); intervalID是你想要取消的重复动作的ID,这个ID是个整数,是由setInterval()返回的. 后续补充:setTimeout()可以有第三个参数 setTimeout(fn,delay,param1,param2....) 第三…

总结的js性能优化方面的小知识

前言一直在学习javascript,也有看过<犀利开发Jquery内核详解与实践>,对这本书的评价只有两个字犀利,可能是对javascript理解的还不够透彻异或是自己太笨,更多的是自己不擅于思考懒得思考以至于里面说的一些精髓都没有太深入的理解. 鉴于想让自己有一个提升,进不了一个更加广阔的天地,总得找一个属于自己的居所好好生存,所以平时会有意无意的去积累一些使用jQuerry的常用知识,特别是对于性能要求这一块,总是会想是不是有更好的方式来实现. 下面是我总结的一些小技巧,仅供参考.(我先…

我所经历的JS性能优化

转自http://www.cnblogs.com/koking/archive/2011/10/17/2215665.html 折腾了好几天,纠结了好几天,郁闷了好几天,终于在今天可以释怀了,留下其中的苦乐辛酸来和大家分享. 事情是这样子的,上周接到一个需求,其中涉及到一个好友选择的组件,就是单机左侧某个群组下的好友后该好友移动到右侧,视为选择了它,另外每个群组还有全选,折叠和展开等功能.组件在开发过程中,遇到了在2000条数据的时候,搜索会变的很卡,IE8下为2s左右,IE6更长,我在最初的优…

我总结的js性能优化的小知识

前言一直在学习javascript,也有看过<犀利开发Jquery内核详解与实践>,对这本书的评价只有两个字犀利,可能是对javascript理解的还不够透彻异或是自己太笨,更多的是自己不擅于思考懒得思考以至于里面说的一些精髓都没有太深入的理解. 鉴于想让自己有一个提升,进不了一个更加广阔的天地,总得找一个属于自己的居所好好生存,所以平时会有意无意的去积累一些使用jQuerry的常用知识,特别是对于性能要求这一块,总是会想是不是有更好的方式来实现. 下面是我总结的一些小技巧,仅供参考.(我先…

JS性能优化笔记搜索整理

通过网上查找资料了解关于性能优化方面的内容,现简单整理,仅供大家在优化的过程中参考使用,如有什么问题请及时提出,再做出相应的补充修改. 一. 让代码简洁:一些简略的表达方式也会产生很好的优化 eg:x=x+1;在不影响功能的情况下可以简写为x++; 二. 变量名方法名尽量在不影响语意的情况下简单.(可以选择首字母命名) eg:定义数组的长度可以取名为:ArrLen而不需要取为ArrayLength. 三. 关于JS的循环,循环是一种常用的流程控制. JS提供了三种循环:for(;;).while…

js性能优化的小知识

避免全局查找 function search() { //当我要使用当前页面地址和主机域名 alert(window.location.href + window.location.host); } //最好的方式是如下这样先用一个简单变量保存起来 function search() { var location = window.location; alert(location.href + location.host); } 定时器如果针对的是不断运行的代码,不应该使用setTimeou…