減少來自客戶端的第三方異步調用的數量

我有一個應用程序，其中客戶端向第三方服務器發送多個異步JavaScript請求。我面臨的問題是，無論何時客戶端響應這些響應，該站點都會在這段時間內變爲非活動狀態。因此，發送這些多個請求會增加非活動時間。例如，如果我發送x個請求，並假設每個響應該站點在y平均毫秒內變爲非活動狀態，則總的低效時間爲x * y。如何將這些呼叫減少爲一個呼叫。這我是指第三方是像谷歌分析呼叫，谷歌的廣告鏈接等等減少來自客戶端的第三方異步調用的數量

下面是其中一個呼叫的例子，我想提出

function() { 
     var oldonload = window.onload; 
     window.onload = function(){ 
     __adroll_loaded=true; 
     var scr = document.createElement("script"); 
     var host = (("https:" == document.location.protocol) ? "https://s.adroll.com" : "http://a.adroll.com"); 
     scr.setAttribute('async', 'true'); 
     scr.type = "text/javascript"; 
     scr.src = host + "/j/roundtrip.js"; 
     ((document.getElementsByTagName('head') || [null])[0] || 
     document.getElementsByTagName('script')[0].parentNode).appendChild(scr); 
     if(oldonload){oldonload()}}; 
     }());

來源

2014-09-06 LearningBasics

「吊」是什麼意思？他們做什麼樣的阻塞操作？而是爲該第三方提交一個錯誤消除這種行爲，而不是試圖影響其執行。 – Bergi 2014-09-06 12:13:23

處理應該已被編輯與不活動。。意味着在此期間用戶無法執行任何操作 – LearningBasics 2014-09-06 12:15:00

您是否認爲通過捆綁請求，響應也越來越大，並且該網站平均掛起次數較少，但平均時間較長？這些請求究竟做了什麼，並且可以捆綁什麼以降低開銷？ – Bergi 2014-09-06 12:15:11

首先：內嵌異步JavaScript並不阻止瀏覽器。但立即調用函數呢。您不需要將window.onload回調嵌入到立即調用的函數中。

我建議你提供一個功能，對瀏覽器事件做所有事情。舉個例子：

window.onload = function() { 
    //do everything here 
}

如果是把這個腳本您的應用程序邏輯可能</body>前右關閉標籤。

這可能會幫助你。無論如何，我還建議您在腳本執行時測量您的應用程序真正在做什麼。例如，您可以使用chrome開發人員工具（時間表選項卡）輕鬆完成此操作。

來源

2014-09-09 07:40:12

在這種情況下，立即調用的函數不會被阻塞，它只是設置window.onload。外層函數包裝僅用於限制範圍。如果函數中不包含oldonload的var語句，則它將是一個懸而未決的全局。 – 2014-09-15 06:16:57

thnx glen !!!!!! – LearningBasics 2014-09-15 06:57:50

問題可能在於adroll如何劫持window.onload，在所有頁面呈現完成後觸發。如果我是你，我會使用jQuery（你調用的其他東西之一就是可能的，所以你可以從Google URL中獲取它，這樣你只需要下載一次）。說得沒錯，在你的頭標記的頂部，使其下載並先加載，併爲您的代碼，使用$（文件）。就緒（）調用，就像這樣：

<!doctype html> 
<html language="en"> 
<head> 
    <title>My Webapp</title> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
    <!--// other library scripts go here -->

...的頭部的休息和身體

<!--// other paste-in tracking code scripts like Google Analytics go here--> 

    <script> 
     $(document).ready(new function() { 

      //Your onload code, which should no longer be blocked 

     }); 
    </script> 

    <script type="text/javascript"> //followed by your adroll script 
    (function() { 
    var oldonload = window.onload; 
    window.onload = function(){ 
     __adroll_loaded=true; 
     var scr = document.createElement("script"); 
     var host = (("https:" == document.location.protocol) ? "https://s.adroll.com" : "http://a.adroll.com"); 
     scr.setAttribute('async', 'true'); 
     scr.type = "text/javascript"; 
     scr.src = host + "/j/roundtrip.js"; 
     ((document.getElementsByTagName('head') || [null])[0] || 
     document.getElementsByTagName('script')[0].parentNode).appendChild(scr); 
     if(oldonload){oldonload()}}; 
    }()); 
    </script> 
</body> 
</html>

這樣的腳本會悄悄地在後臺下載，你的代碼可以繼續做什麼，而不需要他們做。如果這是真的卡住你的代碼運行腳本，你可以設置一個超時功能，而你的代碼加載，通過改變它像這樣加載延遲它半秒左右：

<script type="text/javascript"> //followed by your adroll script 
    (function() { 
     var oldonload = window.onload; 
     window.onload = function(){ 
      setTimeout(function() { 
       __adroll_loaded=true; 
       var scr = document.createElement("script"); 
       var host = (("https:" == document.location.protocol) ? "https://s.adroll.com" : 
       "http://a.adroll.com"); 
       scr.setAttribute('async', 'true'); 
       scr.type = "text/javascript"; 
       scr.src = host + "/j/roundtrip.js"; 
       ((document.getElementsByTagName('head') || [null])[0] || 
       document.getElementsByTagName('script')[0].parentNode).appendChild(scr); 
      }, 500); 
      if(oldonload){oldonload()} 
     }; 
    }()); 
    </script>

這樣，它會立即執行任何window.onload應該爲自己的代碼執行的操作，而半秒鐘後，adroll代碼將異步執行。

來源

2014-09-15 05:20:55

要真正減少js請求的數量，您可以在服務器上使用綁定。這將允許你有一個單一的請求到服務器，它將獲取所有必需的js文件並將它們放入單個響應主體中。的因此，而不是做這樣的事情：

<script src='https://s.adroll.com/js/javascrpt1.js' type='text/javascript'></script> 
<script src='https://s.adroll.com/js/javascrpt2.js' type='text/javascript'></script> 
.... 
<script src='https://s.adroll.com/js/javascrpt100.js' type='text/javascript'></script>

您可以只有一個呼叫

<script src='https://yourdomain/getAllJs' type='text/javascript'></script>

您還可以實現它的方式，將更多可重複使用的，例如，你可以傳遞的文件名您在某些頁面上需要的腳本。

<script src='https://yourdomain/getjs?file=javascript1.js&file=javascript2.js&....file=javascript100.js' type='text/javascript'></script>

我不確定你使用的是什麼服務器技術，所以我沒有在這裏提供示例。在ASP.NET中，例如，您可以使用捆綁和縮小out of the box。

來源

2014-09-15 06:01:46 2ooom

Adroll只能打一個電話。他說的是，從一個代碼中加載所有不同的代碼集，並且按照你的建議，他需要某種服務器端腳本來爲他下載所有的JavaScript文件，或者他仍然在製作來自瀏覽器的相同數量的調用，他只需要創建一個額外的一個來獲取加載其他所有內容的初始腳本。 – 2014-09-15 06:39:15

@SteveK不知道adroll對js腳本有什麼限制，但我很肯定你可以在應用程序啓動時將js文件緩存在服務器上。我實際上試圖解決OP如何「減少來自客戶端的第三方異步調用的數量」的問題 – 2ooom 2014-09-15 07:15:21

減少來自客戶端的第三方異步調用的數量

回答

相關問題