3 способа ускорить загрузку CSS на Вашем сайте
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
Благодарю, за советы. При новых алгоритмах ранжирования, каждая секунда дорога.