Объединение нескольких файлов CSS

Question

Сейчас я использую PHP-скрипт, чтобы собрать несколько CSS-файлов в один скрипт, а затем вывести их с типом содержимого text / css.

Проблема с этим заключается в том, что браузер не кэширует файл.

Есть ли лучший способ сделать это?

Спасибо

Answer 1

Если вам нужно обслуживать CSS через PHP, вы можете принудительно создать заголовок кэша, чтобы браузер мог кэшировать вывод, если того пожелает:

<?php

    header('Cache-control: max-age=3600'); // cache for at least 1 hour
    header('Content-type: text/css');

    readfile('css1.css');
    readfile('css2.css');
    etc...

Answer 2

Почему бы вам просто не использовать @import в глобальном CSS-файле и не связать его с вашим HTML-файлом?

см .: http://www.cssnewbie.com/css-import-rule/

Answer 3

Я использую код, указанный ниже.

Это соответствует рекомендациям Google по скорости страницы.

Обратите внимание, что readfile быстрее, чем include, поэтому следует использовать.

<?php
#$off = 0; # Set to a reasonable value later, say 3600 (1h);
$off = 604800; # Set to 1 week cache as suggested by google

$last_modified_time = filemtime('csscompressor.php'); 
$etag = md5_file('csscompressor.php'); 

ob_start("ob_gzhandler");
ob_start("compress");
header('Content-type: text/css; charset="utf-8"', true);
header("Cache-Control: private, x-gzip-ok=''");
header("Last-Modified: ".gmdate("D, d M Y H:i:s", $last_modified_time)." GMT"); 
header("Etag: $etag"); 
header("Expires: " . gmdate("D, d M Y H:i:s", time() + $off) . " GMT");

// load css files
readfile("global.css");
readfile('jquery-theme.css');
// ...

?>

Вы также должны обслуживать все страницы CSS и JAVASCRIPT следующим образом:

<script src="http://example.com/myjavascript.js?v=<?=$version=?>" ></script>

Переменная $version контролируется вами. Она должна быть задана в файле конфигурации всего сайта. Каждый раз, когда вы запускаете обновление, вы можете просто изменить версию в одном месте, и каждый, кто увидит новый контент, просто отправит его и не будет зависеть от кэша.

Answer 4

«Каскадные таблицы стилей» называются прежде, чем CSS-файлы могут включать другие. Вы также можете указать несколько CSS-файлов в вашем HTML-файле (используя LINK) вместо включения их в строку.

Используйте эти возможности и пусть ваш веб-сервер позаботится об отправке соответствующих заголовков для кэширования на стороне клиента при обработке условных HTTP-запросов.