Django-compress – не compressor.

Ранее я писал об использовании django-compressor (1, 2, 3) для объединения и обработки (чистки, сжатия) css и js файлов.  Вкратце, compressor мне не понравился. На днях появился форк compressor'а – django-css, но как в анекдоте про пропавшее серебро: “ложку мы потом нашли, но неприятный осадок остался”.

Сегодня будем смотреть на Django-compress, который появился значительно раньше compressor’а, но к сожалению (или к счастью) не менялся с 16.03.2009.

Что умеет compress?

• объединять js/css файлы,
• минифицифировать css файлы (вот так, да. На самом деле всего лишь удалять пробелы, переносы, табы и пр. мусор),
• автоматически или вручную обновлять файлы (ура!),
• продвинутый конфиг для объединения в группы, сжатия и пр. опиции,
• включенный фильтр для YUI compressor, CSSTidy,
• инфраструктуру для создания собственных фильтров,
• спец. template тэги для простой загрузки получившегося безобразия.

Установка и настройка

Делаем чекаут svn co http://django-compress.googlecode.com/svn/trunk/ django-compress или клонируем git’ом с адреса git://github.com/pelme/django-compress.git. Заходим в каталог, выполняем python setup.py install.

Мне бы хотелось рассказать тебе, дорогой читатель как работает compress, но я и сам не понимаю. Прелесть compress’а в том, что прям из коробки он умеет все, что нужно.

Для начала в settings.py нужно указать что и как мы будем собирать, сжимать и пр.

COMPRESS_CSS = {

    'common': {

        'source_filenames': (

             'css/ui-lightness/jquery-ui-1.7.1.custom.css',

             'js/jquery.fancybox/jquery.fancybox.css',

             'common/style.css'),

        'output_filename': 'css/common.css',

        'extra_context': {

            'media': 'screen,projection',

        },

    },

    'rikone': {

        'source_filenames': (

             'rikone.ru/css/style.css',),

        'output_filename': 'rikone.ru/css/rikone.css',

        'extra_context': {

            'media': 'screen,projection',

        },

    },

    '72arenda': {

        'source_filenames': (

             '72arenda.ru/css/template_css.css',),

        'output_filename': '72arenda.ru/css/72arenda.css',

        'extra_context': {

            'media': 'screen,projection',

        },

    },

    'realtor-tyumen': {

        'source_filenames': (

             'realtor-tyumen.ru/css/lg-stl.css',),

        'output_filename': 'realtor-tyumen.ru/css/realtor-tyumen.css',

        'extra_context': {

            'media': 'screen,projection',

        },

    },

}



COMPRESS_JS = {

    'common': {

        'source_filenames': (

             'js/jquery-1.3.2.min.js',

             'js/jquery-ui-1.7.custom.min.js',

             'js/ui.datepicker-ru.js',

             'js/jquery.fancybox/jquery.easing.1.3.js',

             'js/jquery.fancybox/jquery.fancybox-1.2.1.pack.js'),

        'output_filename': 'js/common.js',

    }

}



COMPRESS = True

COMPRESS_AUTO = COMPRESS_VERSION = False



COMPRESS_CSS_FILTERS = None

Если уже потрудились добавить csstidy куда-нибудь в видное из проекта место, то можно смело убирать последнюю строку. По умолчанию включенная опция COMPRESS будет жать файлы при помощи JSmin (встроен) и csstidy (последняя строка как раз его отключала). Эта пара (JSmin и csstidy) дает неплохие результаты.

Я тестировал на наборе из трех css файлов (забиты были всякой ерундой из бесплатных шаблонов) и трех js (скопированная debug версия последней jquery). Результат: было 400 кб, стало 312 кб.

Но прелесть подобных инструментов в возможности использовать более мощные инструменты сжатия. Yuicompressor, например, на таком же исходном наборе давал 218 кб. Ощутимо?

Подключить yuicompressor можно так:

COMPRESS_YUI_BINARY = 'java -jar yuicompressor-2.4.2.jar'

COMPRESS_CSS_FILTERS = COMPRESS_JS_FILTERS = ("compress.filters.yui.YUICompressorFilter",)

Jar файл в данном случае у меня лежал в каталоге с проектом, но думаю ни у кого не возникнет проблем с прописыванием полного пути.

synccompress –force

Главная прелесть django-compress в том, что он умеет определять изменился ли файл. Собственно, можно даже использовать номера ревизий в названии комбинированных и сжатых файлов, чтоб уж точно не возникло проблем с кешем.

COMPRESS_VERSION = True



COMPRESS_JS = {

    'common': {

        'source_filenames': (

             'js/jquery-1.3.2.min.js',

             'js/jquery-ui-1.7.custom.min.js',

             'js/ui.datepicker-ru.js',

             'js/jquery.fancybox/jquery.easing.1.3.js',

             'js/jquery.fancybox/jquery.fancybox-1.2.1.pack.js'),

        'output_filename': 'js/common.r?.js',

    }

}

На место “?” встанет номер версии файла. Изменчивость названии – не проблема. Для вызова групп в шаблонах используется специальный templatetag:

{% load compressed %}



{% compressed_css 'common' %}

{% compressed_js 'common' %}

В примере, кстати, заметна ещё одна “приятность”, имена групп для js и css файлов могут совпадать.

Теперь вернемся к заголовку “synccompress –force”. О чем это? Если отключить COMPRESS_AUTO, то файлы перестраиваться не будут, но их можно перестраивать спец. managment командой – synccompres, она смотрит изменились ли файлы набора и перестраивает результирующий файл (если необходимо). Но можно команду “заставить” перестраивать опцией “—force” (вонючий livewriter норовит сожрать двойное “-“). Команду можно дергать по cron или не лениться вызывать руками при обновлении css и/или js.