如何可靠地加載所需的JavaScript文件？

Question

由於互聯網連接問題，我遇到了一些問題，一些必需的JavaScript文件沒有加載。 Body onload事件被觸發，但頁面邏輯所需的類不存在。

還有一件事，我想解決的問題不在於網站，而是在沒有任何圖像或CSS文件的Web應用程序中。 想象一下在iframe中運行的JavaScript代碼。 因此，我只有腳本問題。

以下是我的想法如何解決這個問題，如果我錯了，請評論/糾正我：

1. 在推送到實時時對文件進行模糊處理和組合，因此文件的整體大小將減少，任務將可靠地加載1個文件
2. 在服務器上啟用gzip壓縮。 因此，再次生成的文件大小將會小得多
3. 為該文件放置適當的緩存標頭，因此一旦加載，它將緩存在瀏覽器/代理服務器中
4. 最后，即使擁有所有這些，也可能存在無法加載文件的情況。 在這種情況下，我計划在加載頁面后從JavaScript動態加載該文件。 例如，將有“重試失敗的加載”邏輯，最多5次嘗試

還有其他想法嗎？

Answer 1

如果“重試”腳本無法獲取所需的依賴項，則重定向到站點的“無腳本”版本（如果有）。 或者嘗試使用優雅降級的頁面，因此即使所有步驟都失敗，該站點仍然可用。

Answer 2

1 - 正確但仔細檢查來自不同文件的JavaScript函數是否彼此不重疊。
2 - 正確 - 這應該始終打開。
3 - 正確但瀏覽器仍將嘗試從服務器獲取HTTP 304: Not Modified代碼。
4 - 正確，考慮在嘗試1次或2次失敗后回noscript網站的noscript版本（5次太多）。

Answer 3

我個人認為嘗試重做瀏覽器的邏輯並不值得。 如果頁面中的圖像無法加載怎么辦？ 如果主頁面沒有加載怎么辦？ 如果用戶有互聯網連接問題，他們需要修復這些互聯網連接問題。 很多事情在他們做之前不會可靠地運作。

那么，你是否要檢查你的頁面顯示的每個圖像是否正確加載，如果它沒有加載，你是否會手動嘗試重新加載它們？

在我看來，將一些內聯JS用於檢測外部JS文件是否未加載可能是值得的（所有你需要做的就是檢查外部JS文件中是否存在一個全局變量或頂級函數）然后告訴用戶他們有互聯網連接問題，他們應該解決這些問題，然后重新加載網站。

Answer 4

您的積分對腳本加載有效，但您還必須考慮網站使用情況。

如果由於某種原因未加載腳本，則該站點仍必須完全可用且可導航。 用戶體驗優先於其他所有事物。

應該在瀏覽器加載和可視化網站界面后加載腳本，並且應該包含增強用戶體驗的代碼，而不是您必須完全依賴的內容。

這種方式即使連接速度很慢，我仍然可以閱讀內容並選擇更改頁面或轉到其他位置，而不是顯示空白頁面或僅顯示標題的頁面。

這對我來說是最重要的一點。

另外，你確定重試方法嗎？ 它會導致對服務器的更多請求。 如果連接緩慢或滯后，那么最好不要運行腳本，特別是考慮到用戶可能在頁面上花費的時間很少，只需要快速閱讀內容。 此外，在連接速度很慢的情況下，您會為超時設置多長時間？ 如果在超時觸發時下載腳本並再次重試，該怎么辦？ 如何有效地確定時間量和連接的“緩慢”？

編輯

你試過head.js嗎？ 是一個插件旨在盡可能快的sripts加載，也許它會有所幫助。