內嵌或從單獨的AJAX調用中包含JSON數據？

我正在開發一個網站，其中用戶的「主頁」頁面包含一些數據供一些廣泛的JavaScript代碼使用。目前，數據被編碼爲文檔主體末尾的腳本標記中的JSON對象，並且GUI控制對象剛剛被實例化，以便它可以訪問DOM和JSON對象。我喜歡這種結構，因爲它可以讓頁面快速加載。它看起來是這樣的：內嵌或從單獨的AJAX調用中包含JSON數據？

<body> 
    <script type="text/javascript" src="mylib.js"></script> 
    <div>...lots of DOM and text content...</div> 
    <script type="text/javascript"> 
    var userData = {...}; // Encoded by HTTP response handler. 
    $(document).ready(function() { 
     // GUI object which modifies form controls, etc. 
     new MyGuiObject(userData, document.form.myForm); 
    }; 
    </script> 
</body>

然而，新的功能可能需要的用戶數據對象返回作爲一個單獨的HTTP請求，這意味着內聯形式將是一個重複的（和違反DRY principle的）。很容易重構上面的代碼來爲userData使用AJAX請求，但它引入了另一個我們知道需要（和可用）的數據的HTTP請求。

是否值得更改代碼以使用從AJAX調用中檢索到的userData？如果是這樣，對從中檢索數據的URL進行編碼的最佳做法是什麼（考慮到它會更好地由Web框架動態生成）？

來源

2011-05-06 maerics

*'var userData = {...};'*這不是一個JSON對象。這是一個** JavaScript **對象（使用JavaScript的對象文字符號，其中JSON是*子集*）。 – 2011-05-06 06:01:39

@TJ：對，謝謝你的澄清，我會編輯這個問題。 – maerics 2011-05-06 06:07:39

我的兒子正在展示。 ;-) – 2011-05-06 06:08:59

是否值得更改代碼以使用從AJAX調用中檢索到的userData？

我不會這麼想，但這將是一個意見問題，並且取決於您的整體環境。這是一個判斷呼籲。

如果您有底層代碼可以生成對象（無論是在初始的script元素內還是更高版本以響應ajax調用），您並沒有違反DRY原則。

如果出現的HTML頁面完全是靜態的（因此可以緩存），那麼您會重複自己，因爲您必須首先在HTML中擁有對象，然後再使用動態響應創建對象到ajax請求。但是如果最初的HTML已經是動態生成的，那麼只需使用一箇中心函數在兩種情況下生成對象。（該函數可以生成JSON格式的字符串，然後在HTML頁面上輸出var userData =，因爲JSON是JavaScript對象字面格式的子集，因此您可以將其放到腳本中，其中對象字面量有效）

DRY與否，我會厭惡添加一個可避免的HTTP請求到我的頁面加載。

如果是這樣，什麼是編碼從數據檢索到的URL最佳實踐...

我不完全相信你通過編碼URL的意思。如果您的意思是包含JSON的響應，請將其發送回Content-Type: application/json。 jQuery將會理解它並將它反序列化爲一個對象，然後將它交給你的函數success函數。

來源

2011-05-06 06:06:17

然而，新的功能可能要求用戶數據對象是返回作爲單獨的HTTP請求，這意味着串聯形式將是重複（和違反DRY 原理）。很容易重構上面的代碼使用該AJAX 請求userData，但它引入了另一個HTTP請求我們知道需要的數據（和可用）立即。

內嵌表單不一定是複製信息。它允許用戶開始查看對象，並且根據您提供的額外信息，如果用戶禁用了JavaScript，它可能允許您的應用程序繼續工作（因爲JavaScript應該只是用於增強應用程序，儘管我知道實際上這對於現代應用來說幾乎是不可能的）。但直接查看錶格（或表格的一部分）的能力是一個優點。

因此，DRY不應該意味着降低某些應用程序的性能或響應速度。這些目標可能經常處於緊張狀態，但你必須走上快樂的中間立場。無可否認，有時易於維護可能會導致一些性能損失，但在大多數情況下，您可能不希望用戶因此遭受損失。

是否值得改變使用的代碼從AJAX調用檢索到的用戶數據？

這聽起來像你在上面說，它會被要求，不是嗎？如果是這樣，你爲什麼需要它異步收到？您是否從其他網站獲取數據，並且希望儘快將內容提供給用戶，然後使用該附加信息更新它們？否則，爲了獲得最佳性能，最好將用戶數據直接提供給用戶，而不是讓他們等待Ajax回覆，因爲Ajax最適用於稍後在應用程序中需要的數據，尤其是考慮到IE的缺點處理2個以上的同時連接。

如果您確實需要Ajax，也許您可以提供一些有關加載的信息，然後再使用其他Ajax返回的數據。

如果是這樣，什麼是編碼從中數據檢索到的URL（考慮到它將更好地利用動態Web框架產生）最佳實踐？

通過對URL進行編碼，您的意思到底是什麼？

你的意思是編碼URL的字符？在Core JavaScript中，通常使用encodeURIComponent()來完成，但在jQuery中，可以使用serialize()和jQuery.param()等方法爲您處理，前者用於將現有表單序列化爲編碼的URL，後者用於獲取數組或對象轉換爲URL編碼格式。

如果您的意思是決定GET還是POST，那麼如果您的檢索對服務器沒有副作用，則應該使用GET，而在大多數情況下，POST是您應該使用的其他方式。

來源

2011-05-06 06:26:25

內嵌或從單獨的AJAX調用中包含JSON數據？

回答

相關問題