Работа со статикой в Django

Проблемы • количество файлов статики на странице • размеры файлов • Less, Stylus => CSS • Co3eeScript, ClojureScript => JavaScript • компиляция шаблонов на клиенте

К чему они приводят • появляется огромный script.js (style.css), в котором много тысяч строк • комментариев нет • код плохо читается • табуляция вместо пробелов (экономия байтов же!) • Less, Co3eeScript и т.п. не используются

Что нужно от инструмента • объединение файлов статики в один • минификация и gzip-сжатие кода • поддержка Less, Stylus, Co3eeScript и т.д. • прозрачная и незаметная работа • удобная отладка

Что уже есть • django_compressor • webassets • другие библиотеки, похожие на webassets • django-gears (порт Sprockets)

django_compressor {% load compress %} {% compress js %} {% endcompress %} script>

webassets register('application', Bundle( 'js/models.js', 'js/collections.js', 'js/views.js', 'js/router.js', 'js/application.js', output='js/gen/application.js', )) # в шаблоне: {% load assets %} {% assets "application" %} {% endassets %}

django-gears /* * application.js * * =require models * =require collections * =require_directory templates * =require views * =require router */ $(function() { new Router(); Backbone.history.start({pushState: true}); });

django-gears

django-gears: отладка {% load gears %} {% js_asset_tag "js/application.js" %}

django-gears: отладка

django-gears • http://git.io/gears • обертка над библиотекой Gears • еще есть Flask-Gears и gears-cli

Зависимости • require • require_self • require_directory • require_tree (скоро) • depend_on (скоро)

Компиляция в CSS и JS • Из коробки поддерживаются: • Less • Stylus • Co3eeScript • Handlebars • Цепочка расширений определяет процедуру компиляции: • application.js.co3ee • style.css.styl

Минификация • slimit (Python) • cssmin (Python) • UglifyJS (node.js) • clean-css (node.js)

Использование python manage.py runserver

Использование python manage.py collectassets python manage.py collectstatic

Спасибо за внимание Вопросы? • @yumatov • http://trilandev.com • https://github.com/yumike • https://github.com/trilan