CSS — это уже неотъемлемый атрибут любого хорошего сайта. Использовать данную возможность просто профессиональная обязанность каждого верстальщика. Но с ростом технологии верстки данные инструкции становятся все объёмней и объёмней. А если еще и проект немаленький, с огромным количеством шаблонов, то само собой разумеется встает вопрос о сжатии CSS-файлов, точнее, каждый разработчик стремится сделать так, чтобы его страницы грузились чем можно быстрее. Для себя я выделил 3 способа сжать CSS файл с помощью PHP.
Первый и самый древний.
Способ хороший и нетрудоемкий, а главное работающий.
Добавляем к расширению файлов «.php». Теперь вызов файла css из нашей страницы будет выглядеть так:
<link rel="stylesheet" type="text/css" media="screen" href="/style.css.php"/>
В начало файла style.css.php добавляем такую строчку
<?php if(extension_loaded('zlib')){ob_start('ob_gzhandler');} header("Content-type: text/css"); ?>
Последней строчкой файла пишем следующее:
<?php if(extension_loaded('zlib')){ob_end_flush();}?>
Все. Более ничего делать не требуется — способ 100% рабочий.
Способ 2 — редактируем только начала файлов.
Переименовываем файлы как и в первом способе.
Добавляем в начало каждого файлы следующий код:
<?php ob_start ("ob_gzhandler"); header ("content-type: text/css; charset: UTF-8"); header ("cache-control: must-revalidate"); $offset = 60 * 60; $expire = "expires: " . gmdate ("D, d M Y H:i:s", time() + $offset) . " GMT"; header ($expire); ?>
Способ удобней первого тем, что не нужно редактировать еще и последнюю строку файла.
Способ 3 — сложный, но удобный.
Переименовывать файл не нужно. Вместо этого создадим новый, например styles.php и включим его в шаблон
<link rel="stylesheet" type="text/css" media="screen" href="/styles.php"/>
Код файла styles.php
<?php header('Content-type: text/css'); ob_start("compress"); function compress($buffer) { /* remove comments */ $buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $buffer); /* remove tabs, spaces, newlines, etc. */ $buffer = str_replace(array("\r\n", "\r", "\n", "\t", ' ', ' ', ' '), '', $buffer); return $buffer; } /* все ваши CSS файлы */ include('master.css'); include('typography.css'); include('grid.css'); include('print.css'); include('handheld.css'); ob_end_flush(); ?>
Данный способ можно еще и докрутить, чтобы например передавать параметрами какие файлы вызывать и тому подобное.
Эти способы я выделил так как они самый быстрые и по-моему удобные, естественно за исключением настроек, которые мы можем сделать в .htaccess.
Мой третий пост за неделю. Интересно, насколько меня еще хватит, как думаете?!
а насколько быстрее по сравнению с обычным подключением ?
просто как то сомнительно все это
хотелось бы график загрузки файлок при обычном добавлении и ваши примеры …
тогда бы я и себе применил такой способ 🙂
Ваш комментарий чуть не стал поводом для моего следующего поста, но отвечу тут:
берем для примера файл весом чтуь более 6кб. Первым и вторым способ они получаются примерно равны и весят по 1кб при отдаче клиенту, третьим файл весит чуть меньше 5Кб
спс, если напишете планируемый пост будет здорово
зашел на сайт и благодаря этой статье стал rss подписчиком так что будим почитывать , пишите еще 🙂
Попробую вашы методы,у меня посещаемость на одном из блогов около 1000 человек, а хостинг имеет ограничение по трафику. Обезательно использую все методы, а то хостинг провайдер уже мне письмо прислав срекомендацией переежать на новий акаунт, а это дополнительные расходы.
Тогда я бы посоветова Вам включить в .htaccess такую строку — это позволит сжимать и css и js и текстовый контент средствами apache
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/javascript text/css application/javascript
Благодарю, за советы. При новых алгоритмах ранжирования, каждая секунда дорога.