Автоматическое сокращение и кеширование CSS

Question

В моем проекте CSS-файлы могут быть предварительно обработаны, а затем при желании уменьшены (в зависимости от конфигурации).

Q1.Нужно ли создавать несколько вариантов кэша для разных комбинаций файлов CSS?

res.php?stylesheets=test.css,test2.css,test3.css
res.php?stylesheets=test.css,test3.css

Q2.В прошлом я заметил, что таким файлам кеша присваивался некий GUID.Как я могу сгенерировать такой идентификатор на основании запроса?

res.php?stylesheets=test.css,test2.css,test3.css
  => cache/css/a3cadfeA33afADSFwwrzgnzzddsveraeAE
res.php?stylesheets=test.css,test3.css
  => cache/css/ergope4t5oiyk0sfb9x0fHkg04mm04tjzG

Пожалуйста, извините за наивность вышеуказанных идентификаторов!

Каким-то образом мне нужно иметь возможность восстановитьтот же идентификатор из указанных таблиц стилей.

Мой вопрос касается только кэширования нескольких вариантов и генерации идентификаторов.

Answer 1

Assetic , похоже, хорошо умеет создавать ресурсы JS / CSS и минимизировать их, помещая в кеш.

Answer 2

А1: Да, я думаю, что лучшее решение - создать одно для каждой комбинации. Но вы можете кэшировать каждый файл отдельно и объединять их, но я думаю, что это быстрее, когда вы кешируете их вместе. A2: вы можете рассчитать GUID / хэш / и т. Д. из контрольных сумм файлов. как:

sha1( sha1(file1) + sha(file2) .......)

Хорошей идеей является кэширование этого поколения идентификаторов тоже с очень коротким ттл.

Эта простая реализация имеет несколько интересных функций, таких как генерация Etag: http://rakaz.nl/projects/combine/combine.phps

Answer 3

1. Да, на некоторых страницах потребуются различные комбинации таблиц стилей.Каждая комбинация должна кэшироваться индивидуально.К сожалению, браузер не будет знать, что нет разницы между ?stylesheets=a.css,b.css и ?stylesheets=b.css,a.css, поэтому оба должны быть кэшированы.

2. Это используется, чтобы убедиться, что браузерне случайно кэширует динамически сгенерированную таблицу стилей.Это не нужно, если вы используете приличный минификатор.Обычно идентификатор GUID определяется путем хеширования last-modified раз каждого файла в списке.Как я уже сказал, большинство минифайеров автоматически проверяют наличие новых версий файлов и удаляют старую кэшированную версию.

Я бы предложил PHP Minify .Установка так же проста, как копирование папки в корень документа.Он также поддерживает сжатие JavaScript с помощью Google Closure Compiler.

Answer 4

Посмотрите на https://github.com/web-developer/Resource-Handler. Это позволяет вам объединить все ваши CSS в 1. Он также сжимает, минимизирует и даже кэширует ваш CSS.Это также работает для вашего JS.Это требует наименьшей конфигурации или хлопот, в отличие от некоторых других предложенных.

ОБРАБОТКА РЕСУРСОВ

Answer 5

По первому вопросу я бы просто свел все ваши (часто используемые) CSS-файлы вместе в один файл и не стал бы беспокоиться о всех возможных комбинациях.Таким образом, каждый последующий запрос может просто использовать один и тот же файл CSS из локального кэша, вместо того, чтобы извлекать другой уменьшенный файл в зависимости от требуемой комбинации.Используйте надлежащие ID и имена классов, чтобы избежать коллизий стилей, когда все заканчивается одним файлом.

Что касается вашего второго вопроса, это обычно делается с помощью какой-либо системы сборки (например,та же система, из которой вы вызываете минификатор CSS).Каждый раз, когда файлы CSS перестраиваются, генерируется номер сборки, номер номера версии (может быть просто инкрементным, может быть хэшем файла md5), который затем используется вашим приложением в сгенерированных URL-адресах ссылки таблицы стилей.