我有一个仪表板屏幕,需要在加载时发出大约 20 个 AJAX 请求,每个请求返回不同的统计信息。总的来说,所有请求返回大约需要 10 秒。然而,在那 10 秒内,UI 几乎是锁定的。
我记得读过 Nick Zakas 的一本 JS 书,其中描述了在密集操作(使用计时器)期间保持 UI 响应能力的技术。我想知道是否有类似的技术来处理我的情况?
*出于多种原因,我试图避免合并 AJAX 调用
$(".report").each(function(){
var container = $(this)
var stat = $(this).attr('id')
var cache = db.getItem(stat)
if(cache != null && cacheOn)
{
container.find(".value").html(cache)
}
else
{
$.ajax({
url: "/admin/" + stat,
cache: false,
success: function(value){
container.find(".value").html(value.stat)
db.setItem(stat, value.stat);
db.setItem("lastUpdate", new Date().getTime())
}
});
}
})
最佳答案
如果您有权访问 jQuery,则可以利用 $.Deferred
对象同时进行多个异步调用,并在它们全部解析时执行回调。
http://api.jquery.com/category/deferred-object/
http://api.jquery.com/deferred.promise/
如果这些回调中的每一个都对 DOM 进行修改,您应该将更改存储在某个临时位置(例如内存中的 DOM 对象),然后一次将它们全部附加。 DOM 操作调用非常耗时。
关于javascript - AJAX 调用期间 UI 无响应,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10920707/