如何在Jquery中优化ajax请求?

时间:2015-10-15 07:15:19

标签: javascript php jquery ajax

我正在使用jquery mobile,jquery和php后端构建移动应用程序。 我的问题是在我发送和接收多个ajax请求的某些页面中,这些请求明显降低了性能并导致内存泄漏,从而导致应用程序在低网络连接中崩溃

优化ajax请求的可能方法是什么?

注意: - 我定期发送一些ajax请求(比如一秒一次)        根据事件发送一些ajax

8 个答案:

答案 0 :(得分:23)

首先,正确编写的Ajax代码不会泄漏内存。因此,如果您确实有泄漏,那可能是由于代码编写错误造成的,而不是使用Ajax。

然后,您可以考虑进行一些优化。

  1. 将多个请求与服务器合并为一个更大的请求。这样可以节省往返服务器,节省带宽,节省电池电量并提高性能。

  2. 不要每秒轮询一次。了解您轮询服务器的频率。

  3. 根据可能的活动延长轮询间隔以改变它,切换到“长轮询”或切换到webSocket,这样就可以在没有轮询的情况下进行服务器推送。

  4. 分析导致内存消耗过多的原因并修复错误或重新设计以减少内存消耗。没有理由认为大量的Ajax调用会“泄漏”内存。它会缩短电池寿命,但如果编码正确,则无需泄漏内存。

  5. 哦,并且毫不犹豫地提取已经存在的一些高规模社交网络应用程序,打开调试器,切换到网络选项卡并研究他们正在做什么。您也可以从已经解决了这个问题的高规模应用程序中学习。

答案 1 :(得分:3)

长轮询比轮询更好

如果您在设置的时间间隔内轮询,那么在服务器端设置超时并等待返回给定数量的循环之前,可能会更好。这对SPA特别有意义。 但是,如果您进行轮询,则应该增加所有空响应的间隔时间。

按活动分组请求,而非按实体分组

假设您每10秒轮询一次,以检索新邮件。此外,您每10秒轮询一次以检索更多通知。您不应该执行两个请求,而应该只执行一个ajax请求并返回一个大的json响应,然后您可以使用它来修改客户端上的DOM元素。

如果可能,请使用服务器发送的事件或套接字

套接字或服务器发送事件将导致请求少得多,并且只会在服务器端发生实际情况时通知您。这是一个很好的comparison

答案 2 :(得分:2)

以下是您可以做的一些事情

<强>首先

  • 摆脱所有内存泄漏。将您的应用程序放入沙箱,并给它最难以记录任何内存泄漏的时间。调查它们并更正您的代码。

然后

  • 减少请求数量。仔细研究应用程序中的最佳阈值,并仅在论文中触发您的请求。尝试批处理您的请求,并尽可能将它们放入单个请求中。

  • 尽可能使用GET请求。它们相对简单,行动迅速。此步骤对于在其操作中触发大量请求的应用程序非常重要。

  • 仔细选择数据格式。它可以是纯文本,JSON或 XML。弄清楚对你的影响最小的那个 应用并切换到适当的。配置您的服务器 尽可能使用数据压缩。

  • 优化服务器。使用正确的ExpireCache-Control标头 对于内容是服务器。如果可能,请使用ETags

  • 尝试将您的内容放在CDN上。这可能会将资源放在一个 地理位置更靠近用户的位置,使您的应用程序更快地运行。

答案 3 :(得分:1)

此外,如果您想制作聊天服务器或向服务器发送快速消息,您应该使用像socket.io这样的webSockets。

答案 4 :(得分:1)

优化(最小化)jQuery AJAX调用主要有3个步骤:

  • 在调用函数时将完成的回调函数作为参数传递
  • 从函数返回jqXhr对象,并分配完成回调
  • 或者切换到使用jQuery.ajax(),并传递整个选项对象

请参阅此链接:How to optimize (minimize) jQuery AJAX calls

答案 5 :(得分:0)

您可以使用Ajax调用的缓存功能来帮助您在请求期间首先获取所有数据并存储在缓存中,并且从下次没有发生Ajax请求并仅使用缓存数据完成数据操作。

此外,您只能通过减少Ajax调用时请求和发送的数据量来优化Ajax调用请求和响应时间。这只能通过在Ajax调用期间删除不需要的数据来完成。

除此之外,所有优化都依赖于代码和数据库逻辑。为了提高性能并减少应用程序崩溃,优化的代码和数据库逻辑可以帮助您。

答案 6 :(得分:0)

  1. 使用ajax回调创建变量并使用它
  2. 每隔一秒你创建一个新的xhr请求实例,它将在 内存直到完成回调执行。更好的方法是创建新的ajax 请求以前的ajax完成,这意味着你将只有一个 xhr请求实例。
  3. 将数据发送到服务器后,清理对象数据,例如:

    array.length = 0;   object = null;   image.src =“”;   file = null;

答案 7 :(得分:0)

正如@jfriend00所说,Ajax请求不会产生内存泄漏问题......

这是你的代码可能做的!

执行所需操作的最佳方法是使用数据层服务打开套接字层,因此,在发生域模型更改时,可以通知您,而不是轮询。

结帐Socket.io ...

如果您不想实现套接字层,我认为提高性能的方法并不多......

另外一点 - 当然 - 对于代码改进操作(重构,ecc。),在我看来,你可以做的是实现“尾部管理系统” .. 。

  • 研究承诺如何运作(es6jQueryQbluebird
  • 创建一个QueueService,一个知道如何序列化所有(Ajax)任务(promises)的简单Javascript类;
  • 在控制器和数据层访问服务之间插入QueueService
  • 实现一个简单的轻量级CacheSystem,以防止不必要的AjaxRequests!