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

1,984 views

Published on

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,984
On SlideShare
0
From Embeds
0
Number of Embeds
124
Actions
Shares
0
Downloads
10
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

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

  1. 1. Работа со статикой в Django
  2. 2. Проблемы• количество файлов статики на странице• размеры файлов• Less, Stylus => CSS• Co3eeScript, ClojureScript => JavaScript• компиляция шаблонов на клиенте
  3. 3. К чему они приводят• появляется огромный script.js (style.css), в котором много тысяч строк• комментариев нет• код плохо читается• табуляция вместо пробелов (экономия байтов же!)• Less, Co3eeScript и т.п. не используются
  4. 4. Что нужно от инструмента• объединение файлов статики в один• минификация и gzip-сжатие кода• поддержка Less, Stylus, Co3eeScript и т.д.• прозрачная и незаметная работа• удобная отладка
  5. 5. Что уже есть• django_compressor• webassets• другие библиотеки, похожие на webassets• django-gears (порт Sprockets)
  6. 6. django_compressor{% load compress %}{% compress js %} <script src="/static/js/models.js"></script> <script src="/static/js/collections.js"></script> <script src="/static/js/views.js"></script> <script src="/static/js/router.js"></script> <script src="/static/js/application.js"></script>{% endcompress %}<!-- на выходе будет нечто подобное: --><script src="/static/CACHE/js/34fe95a4b234.js"></ script>
  7. 7. webassetsregister(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" %} <script src="{{ ASSET_URL }}"></script>{% endassets %}
  8. 8. django-gears/* * application.js * * =require models * =require collections * =require_directory templates * =require views * =require router */$(function() { new Router(); Backbone.history.start({pushState: true});});
  9. 9. django-gears<script src="{{ STATIC_URL }}js/application.js"></script>
  10. 10. django-gears: отладка{% load gears %}{% js_asset_tag "js/application.js" %}
  11. 11. django-gears: отладка<!-- DEBUG = True --><script src="/static/js/models.js?body=1"></script><script src="/static/js/collections.js?body=1"></script><script src="/static/js/views.js?body=1"></script><script src="/static/js/router.js?body=1"></script><script src="/static/js/application.js?body=1"></script><!-- DEBUG = False --><script src="/static/js/application.js"></script>
  12. 12. django-gears• http://git.io/gears• обертка над библиотекой Gears• еще есть Flask-Gears и gears-cli
  13. 13. Зависимости• require• require_self• require_directory• require_tree (скоро)• depend_on (скоро)
  14. 14. Компиляция в CSS и JS• Из коробки поддерживаются: • Less • Stylus • Co3eeScript • Handlebars• Цепочка расширений определяет процедуру компиляции: • application.js.co3ee • style.css.styl
  15. 15. Минификация• slimit (Python)• cssmin (Python)• UglifyJS (node.js)• clean-css (node.js)
  16. 16. Использованиеpython manage.py runserver
  17. 17. Использованиеpython manage.py collectassetspython manage.py collectstatic
  18. 18. Спасибо за внимание Вопросы?• @yumatov• http://trilandev.com• https://github.com/yumike• https://github.com/trilan

×