Задача: объединить и сжать все подключаемые файлы JS (CSS) в один файл, тем самым уменьшив количество запросов к веб-серверу и ускорив загрузку сайта, разработанного с помощью веб-фреймворка CakePHP.

Установка: ниже прикрепляю архив со всеми необходимым файлами. Архив нужно распаковать поверх существующей папки app.

Скачать combiner-1.02.zip (размер: 12295 байт)

История изменений:

• 25.03.2011 (1.02) – не выводился html подключения javascript в случае, если был создан новый.
• 15.03.2011 (1.01) – не работал обычный режим без сжатия и компрессии.
• 11.03.2011 – первая версия.

В классе app_controller.php необходимо подключить наш Helper.

В layout-ах CSS и JS нужно подключать следующим образом:

После всех подключений необходимо выполнить следующий код, который сформирует html для подключения файлов:

По умолчанию в корневой папке веб-сервера необходимо создать папку cache и дать ей права на запись сервером (apache-м например). В cache будут складываться сгенерированные css- и js-файлы.

Класс Combinator я взял здесь.

И внес в него изменения:

• Сгенерированный файл JS не подключался, исправил.
• Добавил свойство $enable (по умолчнию true), с помощью которого можно выключить генерацию и подключать стили и скрипты по отдельности обычным способом.
• Вместо CSS Tidy я использую csspp.

Преимущества идеи сжатия и комбинирования:

• Увеличивается скорость загрузки CSS/JS.
• Уменьшается количество запросов к веб-серверу.

Недостатки:

• Каждый раз происходит проверка всех файлов на наличие в них изменений. Это необходимо для автоматической генерации новых файлов с актуальным содержимым.
• Немного усложняется отладка.
• Если на различных страницах подключаются разные стили и скрипты, необходимо создавать отдельные файлы.
• Папку cache желательно переодически чистить, т. к. после внесения изменений в стили или скрипты создаются новые файлы кэша, а старые не удаляются.

В целом почти все недостатки при необходимости можно исправить.