使用AJAX導致頁面運行速度過慢的多種形式

我正在Django/python中構建網站，並且在此特定頁面上，視圖返回一組對象。該模板然後爲每個對象生成一個表單，並使用AJAX提交表單。使用AJAX導致頁面運行速度過慢的多種形式

一切正常，因爲我希望它沒有錯誤，但問題是視圖中的對象越多，AJAX的工作越慢。有大約100個物體，每個物體需要2到3秒鐘，其中約10個物體需要不到一秒的時間。

本來我試着評論了很多提交的事情，但它並沒有提高速度！

我不知道如何在不改變代碼組織方式的情況下如何加快速度，這是我真正喜歡的功能！

我一直在尋找，但所有的答案都是說，它提交的表單需要很長的時間，而這對我的代碼速度沒有影響。

interact.html

{% for adopt in adopts %} 
    <form class="interact-form"> 
     <!-- some fields --> 
    </form> 
{% endfor %} 

<script type="text/javascript"> 
$(document).ready(function(){ 
    $(".interact-form").submit(function(){ 
     event.preventDefault(); 

     $.ajax({ 
      url: '{% url 'interact' %}', 
      type: 'POST', 
      data: $(this).serialize(), 
      context: this, 
      success: function(data) { 
       $(this).css("opacity", "0.3"); 
       $(this).css("cursor", "not-allowed"); 
      } 
     }); 
    }); 
});

我有點新Django和很新的AJAX，真的希望一些幫助。代碼非常簡單，但是在這裏它是（簡化的），如果這將有所幫助。

來源

2017-08-10 Audrey Serene

每個AJAX調用都需要開銷自己的頭和連接以及大多數我們大多數人不想考慮的其他網絡信息。除了沉重的瀏覽器之外，服務器應用程序不斷處理這種級別的請求可能代價昂貴。我對django一無所知，但我認爲你應該能夠將網絡事務抽象到它自己的層中，以編譯一系列請求並間隔發送它們。 – slackOverflow

謝謝你的幫助！我真的不確定我是否有足夠的先進技術來進行這樣的工作，但這是一個很好的起點！ –

您的ajax數據可能主要是json編碼的javascript對象，因此您可以使每個「類型」數據成爲全球範圍內每隔0.5秒發送一次的屬性。雖然我沒有太多地使用ajax，甚至可能有這個工具可用於這個 – slackOverflow

我認爲這是因爲你正在將你的this變量傳遞給你已經有很大內容的ajax context。所以這就是我認爲會減慢Ajax速度的原因，而且，在速度（特別是html數據）的情況下，接收的數據類型也扮演着重要角色。如果我是你，我想只接受來自ajax網址的JSON，使用dataType: 'json'--這是你可以用ajax玩的最快的數據類型。

$(".interact-form").submit(function(){ 
    event.preventDefault(); 
    var $this = $(this); 
    $.ajax({ 
     url: '{% url 'interact' %}', 
     type: 'POST', 
     data: $(this).serialize(), 
     dataType: 'json', 
     success: function(data) { 
      // we are now expecting that `data` is a valid JSON object 
      $this.css("opacity", "0.3"); 
      $this.css("cursor", "not-allowed"); 
     } 
    }); 
});

來源

2017-08-10 04:03:08 dexterb

我實際上只是添加了上下文，它似乎並沒有影響速度。我也更新了你的建議，我沒有注意到有什麼區別！ –

使用AJAX導致頁面運行速度過慢的多種形式

回答

相關問題