不建議使用同步XHR（AJAX）？

Question

我已經在我的網站上建立了翻譯系統（由您真正開發），基本上是一些返回數組的php文件。

hello.php

return [
  'world' => 'Hello, world!'
];

通過課程輕松訪問

Lang::get('hello', 'world'); // Hello, world!

構造響應時，這一切都很好，但是在某些情況下，我需要顯示翻譯而無需請求。 例如，我做了另一個方便的功能，即在表單上進行PHP驗證，並自動生成了JavaScript規則，該規則在發送請求之前在頁面上執行了相同的驗證，如果驗證失敗，那么我需要顯示相應的消息-驗證失敗的原因可能有數百種。 請注意，這只是一個示例用例，因此我看到的解決方案是：

• 我可以用初始請求加載所有翻譯字符串，並准備顯示其中任何一個。 這將浪費大量帶寬，因為大多數時候根本不需要這些字符串中的大多數。 我可以更進一步，然后將它們緩存在本地存儲中，但是緩存整個站點的文本內容（可翻譯）可能超出了允許的存儲量，因此這似乎不是很可靠。

• 無論如何，我仍然可以發送一個請求並檢索所需的翻譯，這在示例用例中破壞了進行這種驗證的整個過程，但是比以前的解決方案更好，而且如果操作正確，我可以從瀏覽器的內部受益緩存只會請求一次翻譯，然后在后續請求中從緩存加載它們，這聽起來不錯。

我選擇了第二種解決方案，而我面臨的問題是：

我有一個JavaScript函數，將用偽代碼來描述。

function translate(file, key) {
  if(!storage[file]) {
    storage[file] = sendAjaxAndLoadFileFromServer();
  }

  return storage[file][key];
}

var storage = {};

我不知道如果瀏覽器已緩存請求，是否需要在頁面上進行此輔助緩存，但這似乎不會造成危害？ 我也可以對此發表意見。

現在這行得通，因為我正在同步發送AJAX請求。 但是我在控制台中看到此消息：

不贊成在主線程上使用同步XMLHttpRequest，因為它會對最終用戶的體驗產生不利影響。 有關更多幫助，請訪問http://xhr.spec.whatwg.org/

在建議的站點上，我沒有看到任何暗示我不應該使用同步請求的內容，但是，此消息中不推薦使用的詞使我產生了思考。

不幸的是，這是我實現此解決方案（通過同步請求）的唯一方法，因為該函數是在需要返回值的位置被調用的，例如

new Dialog(translate('world'));

在這種情況下，我看不到如何實現承諾或其他任何措施。

所以問題是：

我可以使用同步AJAX請求，它們在不久的將來會消失嗎？

Answer 1

恕我直言，沒有什么可擔心的。 不建議使用它，因為它會影響UI（凍結），但這是AJAX的功能。 但是，也許您可​​以異步方式進行操作-顯示等待的疊加，收集所有未翻譯的消息，然后隱藏疊加，然后顯示所需的消息。

根據評論，也許有一種方法：

也許您可以立即使翻譯返回，但可以使用回調。 每次調用翻譯隊列字符串進行翻譯並顯示“正在等待”。 在回調中，您將獲得翻譯后的字符串。

將會有另一個過程-翻譯器。 如果queue不為空，它將定期轉換排隊的字符串（例如，每10ms），並為每個字符串調用已注冊的回調。 處理后，如果隊列為空，則隱藏“正在等待”。

結果將是-第一個翻譯請求顯示為“正在等待”，最后一個請求隱藏了該請求。 所有翻譯都是單獨的，但分批提供。 您需要做的是將字符串替換邏輯移至回調函數。

Answer 2

這將分為兩部分，因為您的問題是打開兩個單獨的主題。

同步AJAX

不推薦使用它是有充分理由的。 如果您執行同步ajax請求，則整個網站將在請求期間凍結。 當互聯網連接速度很快並且服務器迅速響應時，這將花費幾毫秒的時間。 但是，如果瀏覽器必須等待更長的時間才能獲得響應，則該網站可能會凍結幾秒鍾，這可能會使您的用戶感到沮喪。 這就是為什么應該避免同步ajax請求的原因。

錯誤消息的翻譯

您可能還需要考慮以下兩個選項：

• 按語言對翻譯文件進行細分。 始終只加載活動語言的文本。 如果支持語言，則僅加載所有文本的1/5。
• 按形式或頁面或其他相關翻譯消息分組對翻譯文件進行細分。 然后在顯示表單之前加載特定於該表單的翻譯。 這將進一步減少不必要消息的加載。

請求的持續時間= ping +響應大小/連接速度

（對於靜態文件）Ping是僅用於將請求發送到服務器並獲取第一個字節所需的時間。 在光纖上花費1毫秒，而在移動設備上花費數毫秒。 在100ms ping和100kB / s帶寬的3G連接上，以下兩個過程都需要200ms：

• 加載10kB數據（ping 100ms +傳輸100ms = 200ms）
• 發送兩個請求，每個請求幾乎不傳輸任何數據（ping 100ms + ping 100ms = 200ms）

因此，選擇同時加載多個消息的翻譯的解決方案可能是完全可以接受的，因為這樣可以避免由於服務器與客戶端之間的ping而浪費時間。