使用setInterval造成页面阻塞的时候怎么办

最新推荐文章于 2022-11-23 13:55:18 发布
最新推荐文章于 2022-11-23 13:55:18 发布
阅读量6.6k 收藏 1
点赞数 1
分类专栏： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u012429102/article/details/88554674
版权

var timer1 = setInterval(function(){

$.getJson(........)

},5000)

 

因为请求时间超过了设定的时间,此时会造成阻塞

 

 

 

解决方案:

var timer = setTimeout(function(){

$.getJson(........)

setTimeout(arguments.call,5000)

},5000)

约翰·塞纳
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
VUE倒计时组件，解决setInterval （）引起页面卡顿问题
m0_53718249的博客
07-15 3219
VUE倒计时组件，解决setInterval （）引起页面卡顿问题
setInterval阻塞解决方案完整代码
03-03
前端开发中，我们会会经常使用定时器setinterval setTimeout等，但当我们离开页面时，定时器会被阻塞，导致我们再回到页面的时候定时任务会混乱运行，为些我的解决方案写了个简单demo,希望对你有所帮助
一种解决因setInterval阻塞导致手写的时钟时间展示不准的方法
weixin_48009166的博客
11-23 880
显示当前时间，setInternal1000毫秒但setInternal会被很耗时的代码阻塞运行，导致时钟时间显示不准的，setTimeout代替setInternal来解决，每次都算一下时间误差简单粗暴的方法解决 获取服务器时间 获取线上时间 计算时间差得出当前时间戳
js里的setTimeout和setInterval之后的页面是空白,阻塞浏览器的document对象，但是不阻塞script方法...
weixin_34409703的博客
01-11 283
为什么80%的码农都做不了架构师？>>> ...
setInterval()性能问题
spicyIsPleasant的博客
03-25 2683
问题描述： 1-setIterval（）中嵌套使用，但这种情况下要保证内部严格完全正确执行，否则就会造成不断调用这个方法，会造成性能变差 2-在页面关闭时没有使用clearInterval（）来把所有setInterval（）清除，会一直执行，性能大大降低 原因分析： 1-内部调用函数是异步操作，与服务器产生交互，网络延迟等原因造成的阻塞，setInterval不会因此放慢请求，反而仍会定时发起请求，造成请求过多阻塞 2-setInterval内部进行了嵌套，嵌套内部又调用了异步操作，因为网络等原
JS延迟处理函数setInterval
lgc867066679的专栏
08-15 631
WindowOrWorkerGlobalScope 的 setInterval() 方法重复调用一个函数或执行一个代码段，在每次调用之间具有固定的时间延迟。 返回一个 intervalID。使用clearInterval(intervalID) 清除定时操作。 在使用中发现在调用clearInterval()之后setInterval()里面的函数还会再调用一遍。
在vue中使用setInterval的方法示例
10-17
主要介绍了在vue中使用setInterval的方法示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
JS SetInterval 代码实现页面轮询
10-19
2. **避免阻塞UI**：长时间运行的异步任务不应在`setInterval`回调函数中执行，因为它可能导致浏览器的UI线程被阻塞，使页面变得无响应。 3. **时间间隔的精度**：`setInterval`的时间间隔并不是精确的，实际执行...
JS中SetTimeout和SetInterval使用初探
10-20
对于 `setTimeout`，使用 `clearTimeout`，而对于 `setInterval`，使用 `clearInterval`。例如： ```javascript var timer = setTimeout('startShow()', 2000); clearTimeout(timer); timer = setInterval('start...
如何解决setInterval 与页面切换问题
走走看看，珍惜每一刻
08-30 1万+
setInterval 与页面切换问题今天遇到的问题是我用好几个setInterval定时器来做智能采油模拟系统的动态表示，当打开页面时，程序能够正常运行，效果正常，但是当我切换到其他页面，过段时间再切回到采油系统的页面时，动画出现了错乱，不是按原来安排的运行。
定时器详解和应用、js加载阻塞、css加载阻塞
David
04-18 1097
定时器详解和应用、js加载阻塞、css加载阻塞 1.setTimeout()、setInterval()详解和应用 1.1 详解： setTimeout、setInterval执行时机 1.2 存在问题： setInterval重复定时器可能存在的问题、解决方案 1.3 应用： Yeilding Processes（进程暂停） ​ 运行在浏览器中的...
[Javascript] 实现setInterval函数
seasidexin的专栏
10-15 1280
问题 经常使用Javascript的同学一定对setInterval非常熟悉，当使用setInterval(callback, timer)时，每经过timer毫秒时间，系统都将调用一次callback。请问全局如果没有提供setInterval函数，该如何自己实现这一功能？ 方案一：循环或递归（错误解法） 最简单的思路便是通过简单的循环或者递归，每次检查时间戳是否已经超过上次触发给定函数的时间加上间隔时间，如果已经超过便再次触发函数，并重置计时器至当前时间。 const setInte.
标签页切换 setInterval延迟问题
weixin_34302561的博客
05-21 782
最近做了一个小定时器的功能，但是在标签页切换后，定时器就会出现延迟。后面发现是在页面切换后，浏览器会自动延迟执行我们的定时器，以便于节约资源。 例子：开启一个定时器：0.5秒数字自增 大概6秒执行了14次 切换标签页 大概11秒执行14次 在我们切换标签页后，我们的定时器根据浏览器不同，已经能明显感觉到延迟了，这个时候如果我们要保持定时器精度，可以用web work来跑我们的代码，通过...
js定时器
热门推荐
ScumStudy的博客
10-27 2万+
定时器 一、两种定时器 setTimeout() 延迟定时器 setInterval() 循环定时器（‘间隔器’） 定时器中的函数挂载在window对象上，内部的this指向window setTimeout(function(){ console.log(111); },1000) //一秒钟打印出111 setInterval(function(){ console.
JS使用setInterval定时器导致前端页面卡死
田螺姑娘的博客
10-20 8378
JS使用setInterval定时器导致前端页面卡死 原因 setinterval不会清除定时器队列，每重复执行1次都会导致定时器叠加，最终卡死你的网页。 其原因与JS引擎线程有关（需深入研究JS引擎线程） ，但是setTimeout是自带清除定时器的。 解决方案 self.setInterval(() => { self.setTimeout(() => { this.queryChartTime() }, 0) }, 10000) ...
解决定时器导致页面卡顿、卡死的问题
shalDream的博客
06-06 1万+
在项目中有时需要使用定时器，去不断刷新数据重载部分页面，长时间使用会导致线程占用和内存泄漏，导致页面卡顿、卡死的现象。网上查找过不少资料，无法根本解决此问题，下面介绍本人实践过的有效方法： var timerQ = null //首先可以全局定义一个定时器 //清理定时器的公用方法 clearTimerQ(){ try { window.clearInterval(timerQ) } catch (error) {} window.timerQ = null }, //发送交易获
微信小程序关于setInterval的问题
renaissance79的博客
12-08 891
小程序中用到了setInterval进行一个简单的图片切换。 使用微信开发者工具进行调试没有什么异常；但进行真机调试的时候，图片的切换变得很慢（setInterval处的时间设置的是50毫秒） 真机调试： 在进行上传之后，进行扫码，再进行操作，真机调试的问题就解决了，也不知道是为啥？ 我知道应该避免使用setInterval，它是一种重复的调用，可能造成页面阻塞；但是这里是不得不用；如果出现与我类似的问题，可以先尝试上传，看看能不能解决。如果解决不了，也可以试试用setTimeout递归来进一步实现set
前端setInterval和setTimeout计时误差问题分析&&解决方案
LYFlied的博客
04-02 7341
setInterval指定的是“开始执行”之间的间隔，并不考虑每次任务执行本身所消耗的时间。因此实际上，两次执行之间的间隔会小于指定的时间。比如，setInterval指定每 100ms 执行一次，每次执行需要 5ms，那么第一次执行结束后95毫秒，第二次执行就会开始。如果某次执行耗时特别长，比如需要105毫秒，那么它结束后，下一次执行就会立即开始。 为了确保两次执行之间有固定的间隔，可以不用setInterval，而是每次执行结束后，使用setTimeout指定下一次执行的具体时间。
autojs之定时器-setInterval()/setTimeout()
头发浓密的萌新的博客
07-16 8214
1.内存中只能有一个定时器，使用完定时器后要清除 这个之前不知道在哪看到的，但是好像可以设置多个定时器 2.定时器是单线程的 3.循环执行： 设置定时器【setInterval()】清除定时器【clearInterval()】 单次执行： 设置定时器【setTimeout()】清除定时器【clearTimeout()】 详细讲解： //每3秒就发出一次hello var id = setInterval(function(){ //循环定时器id log("hello"); }, 2000); va
js 使用setInterval 导致页面卡顿
最新发布
06-14
在JavaScript中，`setInterval` 是一个用于定期执行指定函数的内置方法。然而，如果使用不当或处理不当，它可能会导致页面卡顿，也就是我们常说的性能问题。以下是可能导致页面卡顿的一些原因： 1. 频繁的DOM操作：`setInterval` 中的函数如果频繁地修改DOM树，比如大量元素的添加、删除或样式更改，这会占用大量的浏览器渲染资源，使页面响应变慢。 2. 无限循环或未及时清除：如果定时器内的函数没有正确的结束条件或者没有被正确地清除（例如忘记调用 `clearInterval`），它将持续运行，直到页面关闭，这会导致CPU负载过高。 3. CPU密集型计算：如果定时器内的函数执行了复杂的运算或I/O操作，这些任务可能占用大部分处理器时间，使得页面暂停响应。 4. 错误的事件监听：如果定时器关联的事件处理函数引起了事件冒泡或阻止默认行为，而这些行为需要大量处理，也可能导致页面卡顿。 为避免这些问题，你可以采取以下措施优化： - 尽量减少DOM操作次数，尤其是当操作涉及到大量元素时。 - 在定时器内完成工作后，确保清除定时器，避免不必要的资源占用。 - 如果有循环，考虑使用 `requestAnimationFrame` 替代，因为它的执行时机更符合浏览器的渲染流程。 - 对于复杂的任务，考虑使用 Web Worker 来在后台线程中运行，减轻主线程负担。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值