縮小動態 php 樣式表

Question

所以我一直在使用Minify來壓縮我的 JS 和 CSS，它們一直運行良好，直到我需要壓縮一些動態的 php 樣式表。

我試圖使用 htaccess 來欺騙它認為它是一個 css 文件，但后來我意識到它使用不受 mod_rewrite 影響的絕對文件路徑

無論如何，每當我將它指向 php 文件時，它總是返回“400 Bad Request”。 除了編寫我自己的壓縮腳本之外，關於如何解決這個問題的任何想法？

Answer 1

我發現處理縮小和壓縮樣式表的最佳方法是自己做。 看看這段代碼：

<?php
header("Content-Type: text/css");
header("Last-Modified: ".gmdate('D, d M Y H:i:s', filemtime($_SERVER['DOCUMENT_ROOT'].$_SERVER['PHP_SELF']))." GMT");
header("Expires: ".gmdate('D, d M Y H:i:s', (filemtime($_SERVER['DOCUMENT_ROOT'].$_SERVER['PHP_SELF']) + 691200))." GMT");

//This GZIPs the CSS for transmission to the user
//making file size smaller and transfer rate quicker
ob_start("ob_gzhandler");
ob_start("compress");

//Function for compressing the CSS as tightly as possible
function compress($buffer) {
    //Remove CSS comments
    $buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $buffer);
    //Remove tabs, spaces, newlines, etc.
    $buffer = str_replace(array("\r\n", "\r", "\n", "\t", '  ', '    ', '    '), '', $buffer);
    return $buffer;
}

//Main style
require_once($_SERVER['DOCUMENT_ROOT']."/templates/style/style.css");

//Other style
if($php_variable) {
    require_once($_SERVER['DOCUMENT_ROOT']."/templates/style/other.css");
}

ob_end_flush();
ob_end_flush();
?>

這里發生了很多事情，所以讓我解釋一下。

標題

• 將文件類型設置為 CSS。
• 設置Last-Modified和Expires header 用於緩存控制（設置為一周多一點，您可以更改此設置）。

縮小和 GZIP

• 使用ob_start ，我們告訴它 GZIP 這個文件以及運行自定義 function compress 。
• compress在發送到瀏覽器時刪除所有 CSS 注釋和空白。 這意味着您可以在源文件中以您喜歡的方式保留所有注釋和間距，以便於編輯，但只將最少的內容發送到瀏覽器。

風格

• 使用require導入樣式表。 對盡可能多的樣式表執行此操作； 它們都將在一個 HTTP 請求中交付給用戶。

使用新文件

您將像調用普通 CSS 文件一樣調用該文件。

<style type="text/css" src="/path/to/css-script.php"></style>

結論

使用這種方法，您正在做一些很棒的事情。

• 為緩存提供正確的標題，從而快速回訪您的站點。
• 縮小所有內容以不包含額外的空格或注釋。
• 使用 GZIP 壓縮文件以獲得更小的文件大小。
• 在一個 HTTP 請求中包含所有樣式表，非常適合優化。
• 避免使用@import語句……這本身就很棒。
• 允許您保留多個樣式表並使用 PHP 邏輯來包含或不包含它們。
• 允許您根據需要保持源樣式表的間距和注釋，而不會對訪問者造成影響。

您也可以對 JavaScript 使用相同的方法，盡管上面的compress function 嚴格適用於 CSS，所以我將省略它。

將此技術與此緩存控制技術結合使用，您已經為自己構建了一個很棒的 CSS/JS 處理程序： 如何強制瀏覽器重新加載緩存的 CSS/JS 文件？