ajax 多个setInterval进行ajax请求的页面长时间打开会出现页面卡死问题
多个setInterval进行ajax请求的页面长时间打开会出现页面卡死问题
浏览器的渲染(UI)线程和js线程是互斥的,在执行js耗时操作时,页面渲染会被阻塞掉。当我们执行异步ajax的时候没有问题,但当设置为同步请求时,其他的动作(ajax函数后面的代码,还有渲染线程)都会停止下来。即使DOM操作语句是在发起请求的前一句,这个同步请求也会“迅速”将UI线程阻塞,不给它执行的时间。这就是代码失效的原因。
方案一:
setInterval会消耗网页内存,如果不清理会一直消耗直到网页卡死。
解决办法:
先清除定时器再创建一个定时器
clearInterval(t);
t=setInterval(ajax,10000);
方案二:(等价于同步)
使用JQuery Deferred对象。
var getWordCount = function(。。。){
var defer = $.Deferred();
var urlStr = "postcommit.html?I_SOURCE=getxliff";
$.ajax({
url : urlStr, //async : false,表示异步执行。
success: function(dataStr){
defer.resolve(dataStr);
}
});
return defer.promise();
}
var myTotalprice = function(。。。){
//当getWordCount() 执行完成后,执行done()以下操作。就跟同步效果一样。
$.when(getWordCount(。。。)).done(function(dataStr){
alert(dataStr);
});
}
方案三:
参考地址:https://www.jianshu.com/p/55448bc08961
使用web worker:
var worker = new Worker('worker.js');//必须是同域的
worker.postMessage(msg);//主页面向worker发消息。msg可以是对象,字符串之类。
onmessage = function(evt) {// 处理主页面发来的消息
postMessage('reveive data ' + evt.data + 'from page');// 向主页面发消息
}
worker.terminate();
方案四:
长连接方式实现:xmlhttp池
ajax 多个setInterval进行ajax请求的页面长时间打开会出现页面卡死问题的更多相关文章
- JavaScript———从setTimeout与setInterval到AJAX异步
setTimeout与setInterval执行 首先我们看一下以下代码打印结果 console.log(1); setTimeout(function() { console.log(2); },1 ...
- setInterval调用ajax回调函数不执行的问题
setInterval调用ajax回调函数不执行 1.首先检查你的setInterval()函数写法是否正确 参考写法 // 检查是否支付成功 var isPayRequest=false; var ...
- Ajax详解及其案例分析------如何获得Ajax对象,使用Ajax对象发送GET和POST请求,校验用户名,POST和GET请求时的乱码处理,实现级联的下拉列表
本节主要内容预览: 1 获得Ajax对象 2 使用Ajax对象发送GET请求 3 使用Ajax对象发送POST请求 4 使用Ajax校验用户名 5 POST请求时的乱码处理 6 GET请求时的乱码处理 ...
- Query通过Ajax向PHP服务端发送请求并返回JSON数据
Query通过Ajax向PHP服务端发送请求并返回JSON数据 服务端PHP读取MYSQL数据,并转换成JSON数据,传递给前端Javascript,并操作JSON数据.本文将通过实例演示了jQuer ...
- 从零开始学 Web 之 Ajax(五)同步异步请求,数据格式
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- python 全栈开发,Day87(ajax登录示例,CSRF跨站请求伪造,Django的中间件,自定义分页)
一.ajax登录示例 新建项目login_ajax 修改urls.py,增加路径 from app01 import views urlpatterns = [ path('admin/', admi ...
- Ajax请求参数较长导致请求失败
Ajax请求参数比较长,第5行参数大概1100个字符吧,是接口的请求报文. $.ajax({ type:"POST", url:"${ctx}/test.action?m ...
- 前端通信:ajax设计方案(七)--- 增加请求错误监控、前端负载均衡以、请求宕机切换以及迭代问题修复
距离上个迭代过了很长时间,中间经历了很多事情,也在每个空余时间构思了这个迭代的东西以及下个迭代要做的东西.时间周期稍微长了,望见谅. 而且,至今这个开源库的start也已经到了165个了,会支持关注和 ...
- jQuery通过Ajax向PHP服务端发送请求并返回JSON数据
SON(JavaScript Object Notation) 是一种轻量级的数据交换格式.易于人阅读和编写,同时也易于机器解析和生成.JSON在前后台交互的过程中发挥着相当出色的作用.请接着往下看教 ...
随机推荐
- cmd使用代理
- React文档总结
元素渲染 更新元素渲染 计时器例子 function tick(){ const element = ( <div> <h1>Hello, World!</h1> ...
- mysql数据库怎么安装到自己的电脑上?
安装mysql1.安装过程中输⼊入Y确认继续安装 2.设置密码1.第⼀一次设登陆密码 2.第⼆二次验证密码 安装完成
- windows系统mysql-5.7.19官方绿色版zip包安装教程
环境: 系统环境 Windows 10 64位 mysql版本 5.7.19 一.万变不离的下载 下载页面:https://dev.mysql.com/downloads/mysql/ 点击 Down ...
- spring4-5-事务管理
1.简单介绍 事务管理是企业级应用程序开发中必不可少的技术, 用来确保数据的完整性和一致性. 事务就是一系列的动作, 它们被当做一个单独的工作单元. 这些动作要么全部完成, 要么全部不起作用 事务的 ...
- chrome crx插件存档
https://github.com/mdamien/chrome-extensions-archive
- p2944 [USACO09MAR]地震损失2Earthquake Damage 2
传送门 分析 我们让s到1,关键点到t分别连流量为inf的边 于是我们可以考虑跑s到t的最小割 于是我们将所有点拆为两个点,关键点和1的两个点之间连inf,其余点连1 将原图的边也连上,流量为inf ...
- 事务(进程 ID 64)与另一个进程被死锁在 锁 资源上,并且已被选作死锁牺牲品。
访问频率比较高的app接口,在后台写的异常日志会偶尔出现以下错误. 事务(进程 ID 64)与另一个进程被死锁在 锁 资源上,并且已被选作死锁牺牲品.请重新运行该事务 实所有的死锁最深层的原因就是一个 ...
- R语言笔记完整版
[R笔记]R语言函数总结 R语言与数据挖掘:公式:数据:方法 R语言特征 对大小写敏感 通常,数字,字母,. 和 _都是允许的(在一些国家还包括重音字母).不过,一个命名必须以 . 或者字母开头, ...
- maven环境快速搭建(转)
出处:http://www.cnblogs.com/fnng/archive/2011/12/02/2272610.html 最近,开发中要用到maven,所以对maven进行了简单的学习.因为有个m ...