快速制作多个AJAX调用的方法

Question

我有一个Web应用程序，它会对一些API进行约14-15个AJAX调用。问题是所有AJAX调用所需的时间几乎是我在浏览器中键入其URL时每个单独API显示响应的3倍。

我在DOM Ready事件内立即进行所有AJAX调用。

问题是如何加快同时进行15个AJAX调用的过程，尽快获得响应并相应地操纵DOM。

以下是我心中的一些要点：

1. 所有AJAX调用都应该是异步的。（已经在做了）。
2. 不要同时进行所有AJAX调用。引入某种超时机制，因为同时进行所有AJAX调用可能会阻塞带宽，并降低进程的周转时间。
3. 通过任何方式减少API调用次数。（已经在做了）。
4. 尽量少地操作DOM。（已经在做了）。
5. 在AJAX设置中设置cache:true。我认为这并没有真正帮助，但我在确保内容更新非常缓慢的地方仍然这样做。

任何建议都将是宝贵的！谢谢。

我正在进行AJAX调用的方式

$(document).ready(function(){

    loadSentimentModule();
    loadCountModule();
    loadEntitiesModule();  
    // Some more function calls.

});

function loadSentimentModule(){

   $.ajax({
          url:someurl,
          cache:true,
          dataType:"json",
          success: function(data){

              // Based on data manipulating DOM.
          }

}

// Same kind of function defintions for all the functions.

- void

---

@user1354678输入了。请检查。 - void

你是否有正在运行的服务器？你可以使用相同的想法。你的客户端向服务器发出一个请求（带有api_to_call/params数组？），你的服务器将执行所有API调用并返回一个巨大的数据数组。这对客户端来说更轻便，而且你会拥有一致的性能和响应时间。 - Shanoor

@A.Wolff ShanShan，想象一下，7个调用大约需要1秒钟，其余7个需要10秒钟，现在如果我将它们合并在客户端或服务器上，那么响应时间将会急剧增加。即使是需要1秒钟加载的调用也会开始花费更多的时间。 - void

假设您的服务器每小时执行所有请求API以获取数据，存储它，缓存它或者进行其他操作。然后，您的用户将通过仅一个请求向您的服务器请求获取所有这些数据。 - A. Wolff

@A.Wolff，您的意思是将所有调用的响应存储在某个中间层，然后我可以从那里获取，而没有任何延迟？ - void

Answer 1

您可能不能直接发起ajax调用，而是将它们排队，并让一个管理器控制队列，请参见此处：使用jQuery.queue()排队ajax请求。

- Axel Amthor

---

谢谢。我不知道这个。但是它如何使事情更快？ - void

在有限的资源上按顺序执行任务总比并行执行快。这里的有限资源是带宽，正如您在原始帖子中所述，可能还包括需要处理所有 XML 请求的浏览器。 - Axel Amthor

带宽不是问题。但是假设一个通话需要10秒，如果我连续进行10个这样的通话，那么它们至少需要100秒（未启用缓存），而如果我并行进行这10个通话，时间将会更短。你怎么看？ - void

@void 你不能只针对某些特定的用户交互进行一次相关的ajax调用吗？例如，当用户点击“loadSentimentModule”按钮时，调用“loadSentimentModule()”，等等... 因为如果问题来自于缓慢的API并且无法以某种方式进行缓存，我认为这个问题实际上没有任何解决方案。 - A. Wolff

@A.Wolff 问题是，当我进行单个API调用时，需要1秒钟时间，但当我进行10个API调用时，原本只需要1秒钟的调用就需要5秒钟左右。我认为应该有解决方法。 - void

Answer 2

我建议您在客户端使用async.js模块。也许这正是您正在寻找的东西。

- Roman A.

---

它是做什么的？如果我进行并行的AJAX调用，它将如何更快？ - void

这真的不同于使用 Promise/Deferred 队列逻辑吗？ - A. Wolff