Django Compressor

Клиентская оптимизация дело хорошее, особенно, если клиент будет только рад. Чем быстрее загрузит он страницу, тем будет лучше всем. И каналу, и браузеру, и серверу в целом. Одна из рекомендаций по оптимизации это уменьшить количество запросов к серверу браузером. Каждый <script src> или <link href> это еще один запрос, ожидание, получение, обработка для браузера. Django compressor позволяет сделать уменьшить количество запросов до минимума и еще уменьшить количество выходных данных. Последнее он делает путем обработки входных js/css файлов и удаления лишней информации.

Принцип работы, примерно, следующий: определяется что сжимать настройкой или шаблонным тэгом, файлы обрабатываются и генерируются выходные js/css файлы, в шаблоне прописываются html-тэг с ссылкой на созданные файлы. Сразу добавляется еще один плюс – генерируется уникальное имя для файлов после каждого изменения js/css. То есть пользователь не будет обращаться к старому файлу или использовать его закэшированную браузером версию.

Как использую его я. Установка:

pip install django_compressor

В settings.py к INSTALLED_APPS добавляется  ‘compressor’ и к STATICFILES_FINDERS добавляется  ‘compressor.finders.CompressorFinder’. Остаются только опции для конфигурации самого compressor:

COMPRESS_ENABLED = True
COMPRESS_OFFLINE = True
COMPRESS_OUTPUT_DIR = 'cache'

Первая – что мы будем сжимать, вторая – вручную, третья – в какую папку в COMPRESS_ROOT, которая по умолчанию ссылается на STATIC_ROOT.

Определяем что сжимать. Открываем, например base.html. Добавляем в начало тэг

{% load compress %}

Находим наши ссылки на js/css и начинаем обрамлять их тэгом compress:

{% compress css %}
    <link href="{{ STATIC_URL }}css/bootstrap.min.css" rel="stylesheet">
    <link href="{{ STATIC_URL }}css/font-awesome.min.css" rel="stylesheet">
{% endcompress %}

{% compress js %}
    <script src="{{ STATIC_URL }}js/jquery-1.11.1.min.js"></script>
    <script src="{{ STATIC_URL }}js/bootstrap.min.js"></script>
    <script src="{{ STATIC_URL }}js/raven.min.js"></script>
    <script src="{{ STATIC_URL }}js/content.js"></script>
{% endcompress %}

Запускаем вручную сжатие:

python manage.py compress

На выходе в html коде будет что-то типа

<link rel="stylesheet" href="/static/cache/css/5eeb27a4e773.css" type="text/css" />

<script type="text/javascript" src="/static/cache/js/5b9c773ed2ca.js"></script>

Больше ничего делать не надо. Нет, ну если хочется, то можно посмотреть на вариант настройки, при котором не нужно будет запускать вручную сборку файлов. Еще можно добавить и настроить фильтры, для более лучшей обработки js/css, но стандартных параметров вполне хватает.