壓縮整個網頁（HTML和JS）

Question

我發現了一些工具like this one，可以讓我在網頁中爲javascript代碼創建「自動提取」javascript，它使用各種技術來最小化傳輸大小。

我有a webpage它有一個相當大的JavaScript代碼塊。但是由於我還沒有完成優化文件大小的工作，我正在考慮對網站的HTML位做同樣的事情。在我的博客頁面上，PHP腳本從大量文本文件中提取HTML片段，並將它們連接成一個巨大的HTML文件併發送出去。 Chrome告訴我用gzip壓縮它會減少三分之二的文件大小。

但是我確實關閉了gzip壓縮，因爲發生的情況是，如果您下載了我通過Internet Explorer託管的任何zip壓縮文件，它會使dep忽略gunzip，因此IE下載的文件始終被損壞。我想如果我解決這個小問題，我可以將gzip恢復，但是暫時我想嘗試看看我能否製作一個自解壓HTML頁面。是否有可能讓javascript提取一個巨大的HTML字符串並將整個塊添加爲body元素的子元素？這會起作用嗎？

Answer 1

這樣做會比較慢，而且很容易出錯。任何Javascript錯誤都會導致整個頁面無法呈現，並且您的搜索引擎優化將被徹底摧毀。堅持定期呈現HTML：當瀏覽器正在下載/解析HTML時，它將開始獲取其他資源（圖像，腳本，CSS）並呈現佈局。不要太專注於最小的下載大小，而是最快的整體體驗。

大量使用免費提供的CDN。有兩大巨頭：谷歌和微軟，它們擁有jQuery和Modernizr等各種腳本。在可能的情況下堅持使用谷歌，他們似乎比微軟有更高的採用率，因此熱緩存的可能性更高。過去，將CDNJS用於其他公共可用的庫 - 它們有很多。

縮小您現有的Javascript，併爲靜態和動態頁面啓用內容壓縮。不要強迫它，讓瀏覽器請求它。你在哪個版本的IE上看到腐敗？我還沒有看到這是自IE6以來的一個問題...

使用Javascript打包程序將使您的網站顯示較慢，在您的一端保存更多的傳輸字節的代價。腳本不僅必須運行，而且現在要求用戶的瀏覽器在腳本運行之前執行額外的（可能較大的）額外步驟。

如果您嘗試下載單個文件（使用「另存爲」對話框），則無法使用內容類型爲'application/zip'的gzip。實際的Zip格式可用於PHP，請使用這些庫。

Answer 2

作爲一個快速贏得Cloudflare具有HTML，JS和CSS的自動縮小功能。我們已經使用了一段時間，並取得了良好的效果。絕對值得一看。