有沒有辦法加載模塊化的HTML片段，而不必觸發每個片段的http請求？

Question

我正在使用requireJS和jquery/jquery-mobile應用程序。現在我正試圖優化加載和渲染性能。

假設我的應用程序可以分解爲每個頁面上存在的HTML片段（例如登錄表單）。我的想法是在每次請求新頁面時不加載代碼段。相反，我創建了HTML代碼片段（增強標記）的模板版本，並通過requireJS !text插件將其引入。

這工作得很好，所以每一個片段中必須一次，然後從服務器D緩存，因爲它已經呈現，一切頁後進入平穩1.

基本上我可以atomize我的網頁到段，像

page { content { form { input & button }}} 

並按要求只提取摘要。雖然這種模擬從服務器加載和渲染時間的東西，我最終得到了一個ton of http-requests。

問：
相當通用的，但是......有沒有對構建這樣的應用程序時，削減HTTP請求的數量的方法？我想我認爲websockets可以用於此，但我不確定。好奇地知道，如果有一個很好的方法來做到這一點。

謝謝！

Answer 1

所以，讓我弄清楚這一點： - 您嘗試使頁面加載時間更快 因此，您將HTML文件的內容分解爲片段。有些代碼片段，例如
header/footer/login表單在每個頁面上都很常見，這樣您只需加載它們一次，並從緩存中繼續渲染它們。
但是，當您第一次加載頁面時，由於所有這些代碼段都是單獨下載的，因此有很多請求。
如果我得到了所有正確的，這是我的建議。

我會建議您在第一頁加載實際加載從服務器直接呈現的整個頁面。使用javascript在加載後添加片段可能會很慢。
然後在頁面加載時，可以使用元素選擇器將所有呈現的片段的值保存到緩存中。並下載其他片段。這樣，當頁面加載時你有一個（或很少）請求。當頁面已經被加載時，所有額外的請求都會在後臺完成。

Answer 2

您可以使用RequireJS Optimizer來縮小和組合您的Javascript文件到一個文件中。