使用 minimify code 網站簡化 HTML 網頁的注意事項

在之前的〈ESP8266 全域變數佔用太多導致不斷重置〉中提到需要將 HTML 內容縮減, 才能放入 ESP8266 可用的記憶體中, 試用了許多提供縮減網頁內容的網站後, 發現許多網站縮減出來的內容都有大小不同的問題, 像是：

• 無法同時縮減同時含有 HTML/JavaScript/CSS 的單一網頁內容, 必須自己分開處理。
• 無法正確處理註解, 縮減成單一行後可能因為註解導致原來在註解之後的內容都變成註解了。
• 任意將單引號換成雙引號, 導致 JavaScript 程式碼出錯。

最後最能符合我需求的是 minify code 網站, 符合我需要縮減內含 HTML/JavaScript/CSS 的單一 HTML 檔需求, 唯一的問題是它在處理 JavaScript 字串中的 "\n" 時會轉成 "n", 例如原始內容為：

縮減後變成：

要自己手動找出來修改, 這是美中不足的地方。

ESP8266 全域變數佔用太多導致不斷重置

由於 ESP8266 本身具備 Wi-Fi 無線網路, 在 Arduno Core 中又提供有簡單好用的 WebServer 程式庫, 所以我就在 ESP8266 中塞了一個 Web Server, 利用 String 儲存 HTML 檔, 由於必須假設無法對外連網, 而且需要在客戶端利用 Ajax 通訊, 所以這個 HTML 檔當然也包含了一堆 JavaScript 程式碼, 以及一長串的 CSS 碼。原本測試的好好, 但隨著功能增加, 這個內含網頁 HTML 的字串就越來越大, 突然間原本可以正常運作的程式一上傳到 ESP8266 後, 內建的 LED 燈就不斷閃爍, 而且客戶端裝置根本連不上 ESP8266 自建的網路。開了終端機觀察, 才發現根本一跑起來要連網時就重置, 一直不斷重複這樣的過程：

再為頭看 Arduino IDE, 原來他早就警告我, 全域變數用量過高, 會導致系統不穩定：

對症下藥, 當然就是減少全域變數的用量, 而既然我放的是 HTML 網頁內容, 就找可以壓縮網頁的工具, 經過像是 minify code 處理後, 就正常了。我自己反覆測試, 大概要把全域變數的用量壓在佔記憶體的 65% 以下會比較保險, 程式跑起來才會比較穩定。