縮HTML的起因
如何 提高網頁加載速度 ，需要怎麼對html頁面優化相信是每個擬提高建站技術站長曾想到的問題，其實 網頁優化 的方法還是很多。
有童鞋詢問higrid如何 壓縮HTML，也就是說能不能 把所有的html、js、Css在運行前都壓縮成一行，清除註釋標記、換行符、空格、製表符等。這樣一個直接的好處是 減小html頁面體積來提高前端加載速度。很多人認爲啓動gzip，但一般啓動gzip都比較少對html啓動gzip壓縮，因爲現在的html都是動態的，不會使用瀏覽器緩存，而啓用gzip的話每次請求都需要壓縮，會比較消耗服務器資源，對js,css啓動gzip比較好是因爲js,css都會使用緩存。而大家也用了很多軟件過濾一下壓縮，也有 在線js/css/html壓縮工具，higrid覺得也很麻煩，可讀性很差。higrid認爲如果將壓縮功能做成一個函數的話，這樣開發者看到的是未壓縮的狀態，但訪客訪問時，服務端的程序將 html頁面進行壓縮，清除註釋標記、換行符、空格、製表符等 來達到 減小了html體積的目的。 如果您經常訪問higrid.net， 右鍵查看一下 html源代碼 ，會看到本篇 html源代碼經過了壓縮處理。包括higrid.net 提供的免費內容管理系統 ，輸出的都是壓縮html，去掉了空白、換行符、製表符。但higrid.net 上面也有一些例外，就是higrid.net 主要推薦 在線表格 、在線圖形 ，包括 jquery這些演示，爲了方便訪客，就沒有啓動壓縮。
因此，higrid個人覺得 壓縮html 的最大好處就是一本萬利，只要寫好了一次函數，以後在需要運用的時候調用一下就可以了，所有程序都可以使用，不會增加任何額外的開發工作。今天higrid就給大家分享幾個個人覺得好用的函數，請大家不妨試試看，相信大家會喜歡。
採用php來壓縮HTML
由於higrid對 php 比較感興趣，所以使用 php來壓縮HTML，當然使用其他語言也差不多，例如使用 asp來壓縮HTML，道理應該一樣的。
higrid將 壓縮html的功能用php寫成一個函數 ，其實網上這樣的 php壓縮函數 也很多，不信你可以百度或者谷歌，但多數不是很好用，特別在 壓縮js 或 壓縮CSS 的時候，主要原因是一些 壓縮註釋 等方面不同導致出現問題。 先看這個函數：
/** * 壓縮html : 清除換行符,清除製表符,去掉註釋標記 * @param $string * @return壓縮後的$string * */ function compress_html($string){ $string=str_replace("\r\n",'',$string);//清除換行符 $string=str_replace("\n",'',$string);//清除換行符 $string=str_replace("\t",'',$string);//清除製表符 $pattern=array( "/> *([^ ]*) *</",//去掉註釋標記 "/[\s]+/", "/<!--[^!]*-->/", "/\" /", "/ \"/", "'/\*[^*]*\*/'" ); $replace=array ( ">\\1<", " ", "", "\"", "\"", "" ); return preg_replace($pattern, $replace, $string); } php來壓縮HTML注意事項
php來壓縮HTM 實現的方式主要是用正則表達式去查找，替換。在html壓縮的時候，主要要注意下面幾點：
- HTML 文檔中，多個空白字符等價爲一個空白字符。也就是說換行等空白字符的刪除是不安全的，有可能導致部分元素的樣式產生差異。
- html中有一個pre, 表示 preformatted text. 裏面的任何空白，都不能被刪除，因此pre,textarea 標籤裏面的內容格式需要保留，不能壓縮。
- HTML 中有可能有 IE 條件註釋。這些條件註釋是文檔邏輯的一部分，不能被刪除。因此去掉html註釋的時候，有些註釋是不能去掉的，比如：
- 壓縮嵌入式js中的註釋要注意，因爲可能註釋符號會出現在字符串中，比如： var url = "http://www.higrid.net"; // 前面的//不是註釋
- 對於動態頁面來說，HTML 的壓縮有可能還會增加服務器的 CPU 負擔，得不償失
higrid使用的php壓縮html函數代碼
由於註釋對代碼有作用，higrid使用的php壓縮html函數代碼 沒有去掉註釋，直接上代碼。
function higrid_compress_html($higrid_uncompress_html_source ) { $chunks = preg_split( '/(<pre.*?\/pre>)/ms', $higrid_uncompress_html_source, -1, PREG_SPLIT_DELIM_CAPTURE ); $higrid_uncompress_html_source = '';//[higrid.net]修改壓縮html : 清除換行符,清除製表符,去掉註釋標記 foreach ( $chunks as $c ) { if ( strpos( $c, '<pre' ) !== 0 ) { //[higrid.net] remove new lines & tabs $c = preg_replace( '/[\\n\\r\\t]+/', ' ', $c ); // [higrid.net] remove extra whitespace $c = preg_replace( '/\\s{2,}/', ' ', $c ); // [higrid.net] remove inter-tag whitespace $c = preg_replace( '/>\\s</', '><', $c ); // [higrid.net] remove CSS & JS comments $c = preg_replace( '/\\/\\*.*?\\*\\//i', '', $c ); } $higrid_uncompress_html_source .= $c; } return $higrid_uncompress_html_source; } php壓縮html函數代碼總結
有些童鞋不 推薦壓縮html ， 主要原因除了上面所說的 php來壓縮HTML注意事項 外，通過 gzip 壓縮已經能達到很好的效果。另外，因爲產生影響HTML的角色太多（靜態，動態，前端動態），也沒什麼量化指標，所以很難控制壓縮成什麼樣（代碼寫成什麼程度）。代碼更需要考慮執行效率，而不是傳輸效率。對於動態頁面來說，HTML 的壓縮有可能還會增加服務器的 CPU 負擔，得不償失。Google的壓縮網頁 是因爲早期他希望首頁文本儘可能控制在一個或兩個包內，而且他的首頁太重要了，流量也很離譜。壓縮一個字節，總流量一算都是個不小的數字，自然也就是必要之舉了。進一步的壓縮存在問題，除非能像 Google 一樣充分測試（Google 也僅壓縮了少部分核心服務的頁面），否則不推薦對 HTML 進行壓縮處理。
但使用higrid.net 的 php壓縮html函數 代碼，能很好的解決這個問題。好了，還不快試試。