Сократить динамические таблицы стилей PHP - PullRequest
3 голосов
/ 05 июля 2011

Так что я использовал Minify для сжатия моих JS и CSS, которые работали хорошо, пока мне не понадобилось сжимать некоторые динамические таблицы стилей php.

Я пытался использовать htaccess, чтобы обманутьон подумал, что это файл css, но потом понял, что он использует абсолютные пути к файлам, которые не будут затронуты mod_rewrite

. В любом случае, когда я указываю на php-файл, он всегда возвращает «400 Bad Request».Любая идея о том, как решить эту проблему, кроме написания собственного сценария сжатия?

1 Ответ

7 голосов
/ 05 июля 2011

Я считаю, что лучший способ справиться с минимизацией и сжатием таблиц стилей - это сделать это самостоятельно.Проверьте этот код:

<?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 для управления кэшем (значение чуть больше недели, вы можете изменить это).

Minify и GZIP

  • Используя ob_start, мы сообщаем GZIP этот файл, а также запускаем пользовательскую функцию compress.
  • compressудаляет все комментарии CSS и пробелы при отправке в браузер.Это означает, что вы можете хранить все свои комментарии и интервалы в исходных файлах так, как вам нравится, для более простого редактирования, но только отправлять в браузер только минимум.

Стиль

  • Использование require для импорта таблиц стилей.Сделайте это для стольких таблиц стилей, сколько захотите;Все они будут доставлены пользователю в виде одного HTTP-запроса.

Использование нового файла

Вы будете вызывать файл так же, как и выбудет обычный CSS-файл.

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

Заключение

Используя этот метод, вы делаете несколько удивительных вещей.

  • Предоставляетправильные заголовки для кэширования, что позволяет быстро возвращаться на ваш сайт.
  • Минимизирует все содержимое, не оставляя лишних пробелов или комментариев.
  • Сжимает файл с помощью GZIP для уменьшения размера файла.
  • Включает все ваши таблицы стилей в один HTTP-запрос, отлично подходит для оптимизации.
  • Избегает использования @import операторов ..., что само по себе потрясающе.
  • Позволяет вамхранить несколько таблиц стилей и использовать логику PHP, чтобы включать или не включать их.
  • Позволяет вам размещать исходные таблицы стилей с разметкой и комментариями так, как вам нравится, без последствий для посетителей.

Youможно использовать этот же метод для JavaScripКроме того, хотя приведенная выше функция compress предназначена исключительно для CSS, поэтому я бы ее пропустил.

Используйте эту технику в сочетании с этой техникой управления кешем, и вы создали себе отличный обработчик CSS / JS: Как заставить браузер перезагружать кэшированные файлы CSS / JS?

...