ajax html vs xml/json響應 - 性能或其他原因

我有一個相當ajax沉重的網站和一些3k html格式的頁面插入DOM從ajax請求。ajax html vs xml/json響應 - 性能或其他原因

我一直在做的是採取html響應，並使用jQuery插入整個事情。

我的其他選擇是在XML（或可能的JSON）中輸出，然後解析文檔並將其插入到頁面中。

我注意到，似乎最大的網站做的事情的JSON/XML的方式。 Google Mail會返回xml而不是格式化的html。

這是由於性能？還是有另一個原因使用XML/JSON vs只是檢索HTML？

從javascript的角度來看，它似乎注入直接HTML是最簡單的。在jQuery中我只是這樣做

jQuery.ajax({ 
    type: "POST", 
    url: "getpage.php", 
    data: requestData, 
    success: function(response) { 
     jQuery('div#putItHear').html(response); 
    }

與XML/JSON響應我會做

jQuery.ajax({ 
    type: "POST", 
    url: "getpage.php", 
    data: requestData, 
    success: function(xml) { 
     $("message",xml).each(function(id) { 
      message = $("message",xml).get(id); 
      $("#messagewindow").prepend("<b>" + $("author",message).text() + 
      "</b>: " + $("text",message).text() + 
      "<br />"); 
     }); 
    } 
});

顯然不如從代碼的角度高效，我不能指望它是更好瀏覽器的性能，所以爲什麼要做第二種方式？

來源

2009-07-18 pedalpete

它通常會減少傳輸的數據量，從而提高傳輸速度。由於任何通過網絡傳輸的東西通常是流程中的瓶頸，因此縮短傳輸時間將減少執行流程所需的總時間，從而改善用戶體驗。

來源

2009-07-18 18:51:16

這真的是Garry問題的核心。雖然這也打開了進一步的辯論。有2K下線，我想知道哪裏會有表演？它來自管道嗎？或者是通過插入chuck verses來解析json/xml，然後逐個插入 – pedalpete 2009-07-18 19:52:50

注意到當jQuery從AJAX獲取html時，如果它是一個HTML頁面，那裏有很多數據，jQuery無法解析。由於jQuery構建新DOM節點的方法是將它們保存在div中，因此html，head，body等元素是無效的並被忽略。這可能意味着你通過線路發送了大量浪費的數據。 – 2009-07-18 20:12:35

通常JSON是通過ajax檢索數據的更有效方式，因爲XML中的相同數據要大得多。 JSON也更容易被客戶端Javascript使用。但是，如果您正在檢索純HTML內容，則可能會按照您的建議進行操作。雖然，如果你真的需要，你可以嵌入一個JSON字符串中的HTML內容，並獲得兩全其美

來源

2009-07-18 18:55:38

這裏是發送JSON/XML而不是HTML的幾個優點：

如果該數據將永遠是你的應用程序的HTML之外使用可能較難分析和適應其他結構
JSON可以直接嵌入在script標籤允許跨域AJAX方案
JSON/XML保留的分離服務器端腳本和視圖之間的關注
減少帶寬

來源

2009-07-18 19:02:09

JSON/XML給出相比返回HTML應用程序更多的自由，並且需要在不同的領域更少的具體知識（數據VS標記）。

由於數據仍然只是數據，您可以選擇如何將其顯示到客戶端。這允許很多代碼在客戶端執行而不是在服務器端執行 - 服務器端只需要知道數據結構，而不需要關於標記。所有的程序員需要知道的是如何提供數據結構。

客戶端實現只需要知道如何顯示服務器返回的數據結構，並且不需要擔心這些結構如何實際構建。所有程序員需要知道的是如何顯示數據結構。

如果要構建另一個客戶端（不使用HTML作爲標記語言），則可以重新使用所有服務器組件。構建另一個服務器實現也是如此。

來源

2009-07-18 19:27:19 ylebre

我實際上有一個xml版本用於這些目的。我更關心客戶端處理html vs xml/json的輸入。創建xml vs html的服務器並沒有多大區別。但是如果我知道90％的請求將會來自這個客戶端，那麼爲什麼要先到xml呢？ – pedalpete 2009-07-18 19:31:03

XML構建起來更容易一些，因爲您不需要考慮它將如何顯示。所有您需要擔心的是確保您擁有所有您需要的數據 - 並且數據處於可用結構中。如果您知道您的XML數據結構將如何看待項目的開始，那麼您可以輕鬆地使用2個團隊來處理項目 - 一個用於從源收集數據並將其注入到XML中。另一個團隊可以使用XML模型來處理數據的表示。由於團隊可以獨立工作，他們可以並行工作，從而更快。 – ylebre 2009-07-18 19:40:13

我目前正在對這個決定太摔跤，並沒有完全按一下，直到我看到達林怎麼熬下來：

「如果數據將永遠是你的應用程序的HTML外使用可能更難解析和適合其他結構「我想它的很多地方是/數據如何去。如果它是一個不需要在其他地方共享/發送數據的一次性應用程序，那麼即使它的權重更大，隨後吐出純HTML仍然沒問題。個人而言，如果有複雜的HTML被包裹在數據中，我只是吐出HTML並放入其中.jQuery很甜，所有，但用Javascript構建HTML通常是一種痛苦。但這是一個平衡遊戲。

來源

2010-05-26 19:58:25 morningtoast

您應該檢查出Pure，一個模板工具從JSON數據生成HTML。

來源

2010-10-17 10:31:52

請閱讀這篇文章：
The AJAX response: XML, HTML, or JSON?
從quirksmode.org

它列出了所有反對的和親的和所有可用的選項。

來源

2011-05-10 19:01:12 adardesign

在某些情況下，AJAX響應需要返回更多的信息，而不僅僅是要顯示的HTML。例如，假設您正在返回搜索中前20個項目的列表。您可能需要返回搜索結果的總數，以顯示在DOM中的其他位置。您可以嘗試捎帶一個隱藏的div中的總數，但這可能會變得混亂。使用JSON，總數可以簡單地作爲結構化JSON響應的字段值。

來源

2012-06-04 18:20:10

對我來說，歸結爲：

這對很多人來說，要少得多的工作，以使用服務器端的，成熟的，模板引擎，我們已經習慣，生成HTML，並將其發送下來管道，而不是使用一堆javascript代碼來生成HTML客戶端。是的，現在有一些適用於JavaScript的模板引擎，可能會有所緩解。

因爲我已經分開模型，邏輯和視圖服務器端，沒有另一個分離的論點。 JSON是一種視圖，HTML是另一種視圖。

讓我們面對它; HTML/AJAX和JSON/AJAX都比管道上的整個頁面好很多倍。

您可能需要考慮的最後一件事是;如果你要成爲搜索引擎友好的用戶，你可能不得不以任何方式生成HTML服務器端（老的優雅的口頭禪）。

我通常會做一個組合。如果有客戶端邏輯，我使用JSON - 否則我使用HTML。通知和自動填充特殊字段通過JSON發送。

來源

2015-02-12 20:57:06 frodeborli

ajax html vs xml/json響應 - 性能或其他原因

回答

相關問題