为什么在执行许多ajax请求时浏览器会冻结
why does the browser freeze when executing many ajax requests?
我有一个页面,它使用jquery.load执行了大约200个ajax请求,但它的行为非常不符合ajax,因为在获取结果时浏览器被冻结了。
我所说的冻结是指失去对浏览器的控制,甚至无法上下滚动。然后,当它完成所有请求时,所有结果都会同时显示,但我知道它实际上是通过查看目标服务器的访问日志一次获取6个结果(浏览器控制的"同一主机"策略)。
尽管jquery.load命令是使用"foreach"循环构建的,但当用户加载页面时,它们已经被写入页面的源代码中(因此,出于所有目的,它们都可以单独手工编写),因此页面并不是在等待循环结束。最后一个"症状"是,即使只有30个请求,问题也是一样的。
所以这对我来说很奇怪,我正在寻找导致这种情况的原因以及如何解决的想法。这肯定会让最终用户感到困惑,尤其是因为可能需要90-100秒,直到所有响应都返回,用户才能重新控制浏览器。
一个小更新:
我在另一个网络应用程序中运行了非常相似的代码,它同时处理大约20个请求而没有问题。不同之处在于,它不是获取页面,而是通过脚本发送到服务器并读取/更新文件系统上的文件。我本以为这实际上会有更多的开销,但它没有这些问题。
正如我所说的,即使是20个请求也会导致问题代码出现同样的问题。。。所以我很想它可能与卷曲有关。。。尽管这纯粹是猜测。
更大的更新现在有无限多的代码
应用程序的完整背景是这样的。我们运行一个由世界上流量最高的WebSphereApplicationServer组成的集群,这些服务器正在运行我们的Commerce应用程序。流量的强度意味着,如果我们只是在JVM预热之前让流量进入应用服务器,它们就会崩溃!因此,在允许流量之前,我们访问了一些关键页面,因为这会预编译所有主要的servlet,对JVM进行比例调整,并填充一些servlet缓存。然后流量可以毫无问题地进入服务器,并且运行良好。
我们有一个用CGI编写的应用程序版本,它很有效,但由于同步,速度太慢了。我们正在讨论一些集群的运行时间约为10分钟。由于是同步请求,所以只使用了appserver上的一个线程和一个jdbc连接。
因此,新的网络应用程序所做的是使用这些关键页面的模板,与一系列市场定义(国家代码、语言代码、目录id等)相结合,生成所有需要点击的URL的列表。通过以异步方式访问所有线程,它不仅运行速度更快(现在只需90秒),而且在JVM的比例分配方面也做得更好,最多使用30个线程,并向其全部连接打开JDBC池。因此,当我们打开流量时,它确实处于类似生产的状态。所以我对结果很满意,但从纯粹的装饰和解谜的角度来看,这种浏览器冻结让我很恼火。
因此,在一些代码中,用户只需选择一个应用服务器,应用程序就可以决定它来自哪个集群,并显示它将访问的计算URL列表。此时,页面是一个"Markets x Urls"表,每个单元格都有一个唯一的id,jquery使用该id将正确的结果放在正确的单元格中(因为我们不能保证结果返回的顺序,我们也不想这样做,因为这会使我们再次回到同步区域。
因此,当用户准备好单击Go时,就编写了表并准备好了jQuery命令。点击go,jquery脚本就会被执行,URL会被点击,并返回每个URL的HTTP状态代码,这样我们就知道它们是成功的。
生成的JQ部分看起来像(缩短为几个市场)
$("a#submit").click(function(event) {
alert(" booya ");
$("#sesv-1").load("psurl.php?server=servera.domain.com&url=/se/sv");
$("#sesv-2").load("psurl.php?server=servera.domain.com&url=/se/sv/catalog/productsaz/");
$("#sesv-3").load("psurl.php?server=servera.domain.com&url=/se/sv/catalog/products/12345678");
$("#sesv-4").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?storeId=14&productId=103406&StoreNumber=099&langId=-13&ddkey=http:StockSearch");
$("#sesv-5").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?query=testProd&storeId=14&langId=-11&StoreNumber=011");
$("#atde-1").load("psurl.php?server=servera.domain.com&url=/at/de");
$("#atde-2").load("psurl.php?server=servera.domain.com&url=/at/de/catalog/productsaz/");
$("#atde-3").load("psurl.php?server=servera.domain.com&url=/at/de/catalog/products/12345678");
$("#atde-4").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?storeId=1&productId=103406&StoreNumber=114&langId=-99&ddkey=http:StockSearch");
$("#atde-5").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?query=testProd&storeId=1&langId=-21&StoreNumber=273");
$("#benl-1").load("psurl.php?server=servera.domain.com&url=/be/nl");
$("#benl-2").load("psurl.php?server=servera.domain.com&url=/be/nl/catalog/productsaz/");
$("#benl-3").load("psurl.php?server=servera.domain.com&url=/be/nl/catalog/products/12345678");
$("#benl-4").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?storeId=18&productId=103406&StoreNumber=412&langId=-44&ddkey=http:StockSearch");
$("#benl-5").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?query=testProd&storeId=18&langId=-23&StoreNumber=482");
$("#befr-1").load("psurl.php?server=servera.domain.com&url=/be/fr");
$("#befr-2").load("psurl.php?server=servera.domain.com&url=/be/fr/catalog/productsaz/");
$("#befr-3").load("psurl.php?server=servera.domain.com&url=/be/fr/catalog/products/12345678");
$("#befr-4").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?storeId=130&productId=103406&StoreNumber=048&langId=-73&ddkey=http:StockSearch");
$("#befr-5").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?query=testProd&storeId=130&langId=-24&StoreNumber=482");
$("#caen-1").load("psurl.php?server=servera.domain.com&url=/ca/en");
$("#caen-2").load("psurl.php?server=servera.domain.com&url=/ca/en/catalog/productsaz/");
$("#caen-3").load("psurl.php?server=servera.domain.com&url=/ca/en/catalog/products/12345678");
$("#caen-4").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?storeId=30&productId=103406&StoreNumber=006&langId=-11&ddkey=http:StockSearch");
$("#caen-5").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?query=testProd&storeId=30&langId=-15&StoreNumber=216");
$("#cafr-1").load("psurl.php?server=servera.domain.com&url=/ca/fr");
$("#cafr-2").load("psurl.php?server=servera.domain.com&url=/ca/fr/catalog/productsaz/");
$("#cafr-3").load("psurl.php?server=servera.domain.com&url=/ca/fr/catalog/products/12345678");
$("#cafr-4").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?storeId=33&productId=103406&StoreNumber=124&langId=-09&ddkey=http:StockSearch");
$("#cafr-5").load("psurl.php?server=servera.domain.com&url=/webapp/wcs/stores/servlet/StockSearch?query=testProd&storeId=33&langId=-16&StoreNumber=216")
});
});
PS URL只是一个curl请求函数,它以404、200、500等进行响应,然后用于填充相关单元格。
function getPage( $url ) {
$options = array(
CURLOPT_URL => $url,
CURLOPT_RETURNTRANSFER => true, // return web page
CURLOPT_HEADER => true, // return headers
CURLOPT_FOLLOWLOCATION => true, // follow redirects
CURLOPT_ENCODING => "", // handle all encodings
CURLOPT_USERAGENT => "pre-surf", // who am i
CURLOPT_AUTOREFERER => true, // set referer on redirect
CURLOPT_CONNECTTIMEOUT => 120, // timeout on connect
CURLOPT_TIMEOUT => 120, // timeout on response
CURLOPT_MAXREDIRS => 10, // stop after 10 redirects
CURLOPT_POST => 0, // i am not sending post data
CURLOPT_SSL_VERIFYHOST => 0, // don't verify ssl
CURLOPT_SSL_VERIFYPEER => FALSE, //
);
$ch = curl_init();
curl_setopt_array($ch, $options);
$content = curl_exec($ch);
$err = curl_errno($ch);
$errmsg = curl_error($ch) ;
$header = curl_getinfo($ch);
curl_close($ch);
// $header['errno'] = $err;
// $header['errmsg'] = $errmsg;
// $header['content'] = $content;
return $header['http_status_code'];
}
这里的问题不是Ajax请求,而是每个请求都在更新DOM。浏览器重绘是导致浏览器锁定的原因。
您需要找到一个更好的解决方案,它不会经常写入DOM。
- 为什么继续;语句冻结浏览器
- Javascript-SetTimeout导致浏览器冻结
- 循环的Javascript冻结浏览器,没有语法错误
- AJAX 调用在获得响应并成功执行时会冻结浏览器一段时间
- 如何使用 dojo 在不冻结浏览器的情况下下载文件
- 如何在不冻结浏览器的情况下执行大量javascript代码
- Javascript:在调用服务器时防止浏览器冻结
- AJAX-如何在不冻结浏览器的情况下逐个发出异步请求
- JavaScript函数冻结我的浏览器
- 浏览器使用此JS代码冻结,为什么
- JavaScript锁定功能,以防止递归(浏览器冻结/性能)
- map.fitBounds(边界)导致浏览器冻结
- 我应该如何处理由于大量数据而导致的浏览器冻结
- 多个引导模式使浏览器冻结
- 函数调用自己setInterval(浏览器冻结问题)
- 浏览器冻结了几秒钟
- 防止浏览器冻结和崩溃长时间计算
- JQUERY/JavaScript -故障代码导致谷歌浏览器冻结
- 选择父节点将导致浏览器冻结
- 浏览器冻结是因为(太重?)JavaScript,画布渲染