Структурирование JS-ассетов в Rails 3.1 (Styx)

[zayko]

Т.е. вы, при таком подходе при загрузке страницы Foos#show исполняете код из show: (data)?
А при загрузке страницы Foos#index исполняете код из show: (index)?

Поясните, пожалуйста, суть.

Весь скомпелированный JS грузится, а вы просто заставляете автоматически при загрузке страницы исполняться код из соответствующего метода в coffee? Гем фактически избавляет нас от написания jQuery.ready() для данного action? Так?

[inossidabile]

Да, именно так. Скомпилированный JS грузится весь, ибо при новом механизме ассетов и правильно настроенном сервере это почти всегда лучше, чем много маленьких файлов.

jQuery.ready() недостаточно для того, чтобы запустить JS при таком подходе. Ибо где именно его писать? И как определять какую часть JS сейчас дергать? Все это и делает Styx. Запускает для конкретного action'а конкретного controller'а конкретный код. Причем запускает его как-будто он вызван прямо из , поэтому он не заменяет jQuery.ready().

show: (data) -> $ ->

Вот это и есть, на самом деле, $.ready() в синтаксисе CoffeScript. Т.е. jQuery работает вместе со Styx. Можно запустить код когда страница загрузилась, а можно просто сразу запустить. Кому что нужно.

Кроме этого Styx передает в метод все данные, которые были заботливо скормлены хелперу styx_initialize_with.

Итого: не надо думать как разложить ассеты. Не надо думать как вызвать конкретный код на загрузку конкретной страницы. Не надо думать как передать этому коду данные. Все это, сохраняя новый клевый способ раздачи ассетов, делает Styx.

[zayko]

Не надо думать как вызвать конкретный код на загрузку конкретной страницы. Не надо думать как передать этому коду данные.

Эти два утверждения могу эмулировать так:

layouts/application.html.haml

!!!
%html
  %head
    = yield :js

views/foos/show.html.haml

- any_ruby_var = 'hello world!'
- content_for :js do
  = javascript_include_tag :any_js_file_with_code
  :javascript
    // on Ready or any else code
    alert('#{any_ruby_var}');

И любой JS код для любой страницы могу вызвать и передать ему параметры.
В том числе и вызвать методы скомпилированного JS с различными параметрами.

Минусы только в том самом to_json и в том, что придется писать чистый JS, т.к. в Haml нет фильтра :coffee

Уверен, что гем делает что-то хорошее, но пока не могу найти подходящую задачу, на которой бы смог понять всю его силу.

Или я чего-то не понял?

[inossidabile]

= javascript_include_tag :any_js_file_with_code – это устаревший код. По умолчанию он даже не будет работать. Мне кажется, вы не до конца понимаете как работает новый механизм ассетов, к сожалению.

Вы сделали то же самое, да. Только:

1. Загрязнили лэйаут. Кто знает что за yield такой?
2. Загрязнили вьюху. Вьюхи – не место для кода, не так ли? Они на то и вьюхи.
3. Размазали свой JS в несколько мест. Вы же не будете писать отдельную функцию для каждой страницы, это очевидно. Значит там все-таки будет не одна строка. В итоге у вас получится куча отдельного кода в одном месте, который ссылается на код в другом месте. И еще вендорский код.
4. Отказались от Coffee. Ну тут без комментариев.
5. Даже сам JS загрязнили интерполяциями руби. У нас нет кофи, нет нормальной подсветки в большинстве редакторов и еще синтаксис JS исковеркан рубишными вставками.

Это классические такие спагетти, которые невозможно поддерживать. Не делайте так, пожалуйста. Вместо этого вы могли бы просто написать маленький класс. На чистом Coffee. Там, где он и должен быть – assets/javascripts.

Styx не позиционируется как мега-гем, который изменит мир. Он сделан ровно для того, чтобы каждый не изобретал свой велосипед вроде того, который вы только что описали в своем комментарии. Styx позволяет сделать то же самое правильно, поддерживаемо и не думая каждый раз как именно. Эдакий Rails Way.

[zayko]

хорошие доводы. спасибо

[gazay]

Nice idea. There is something similar with my gem gon about data from ruby. Maybe you can use something from it or maybe point me on my mistakes.

P.s. Sorry for my English skills, I don't have Russian keyboard on phone and hate transliterate :)

[inossidabile]

Я видел ваш гем уже после того как написал этот :). Отличная работа! Больше того, это скорее мне надо позаимствовать умение использовать рендеринг из RABL и Jbuilder, особенно в той части, которая относится к формам.

Мы сейчас находимся в стадии активной разработки JS-фреймворка. И эту идею уже воплотили в его схеме коммуникации с рельсами. Ибо мы как-раз именно эти два билдера и используем, RABL и Jbuilder. Спасибо!

[johnnythekid]

да, пробовал gon, хорошая идея, спасибо за гем.

[Loremaster]

Спасибо вам огромное за этот гем! Чудесная вещь! Использую его в нескольких проектах подряд и уже успел некоторых разработчиков на него подсадить. :)

[Homakov]

1) идея неплохая. нужная не всем, а тем кому нужная имхо проще сделать с нуля такое решение — кода от силы 50 строк
2) совет сделать что то с самой структурой, чтобы небыло много отступов. например
foos.show.js.coffee — а подставлять уже пайплайном в сам метод. незнаю как техн. это сделать

я это решил банально

в лэйауте app.html.haml:
:javascript
App.#{params[:controller]}.#{params[:action]}()

сорсы ваши не смотрел но полагаю там так же.

+непонял зачем в контроллере декларировать вывод дэйты — имхо лучше сделать хелпер и уже во вьюхе выводить
=export_data_for_styx… «hello»
мне такой подход ближе

[inossidabile]

1) А зачем писать 50 строк самому? :)
2) Не понял.

Данные можно передать из из контроллера, и из вьюхи.

[zayko]

В каком количестве своих проектов вы используете данное решение? И в каком направлении пойдет дальнейшее развитие?

[inossidabile]

Мы разделяем проекты на два типа: совсем мелкие и все остальные.

Для всех остальных мы стараемся везде где можно перейти на использование JS-MVC. Мы разрабатываем свой открытый MVC-фреймворк (к сожалению существующие – Backbone, Spine, Ember,… – больше похожи на прототипы чем на то, на чем можно удобно работать), который пока нигде не публиковался, проходит внутреннюю обкатку. У него свой внутренний роутинг и он забирает из рельс шаблонизацию в браузер. Там стикс не нужен.

Для мелких и тех остальных, где по каким-то причинам JS MVC не подошел, везде Styx. Поэтому гем будет поддерживаться.

Развитие будет в основном касаться обработки форм. Той части Styx, которая в этой статье даже не описана (но описана в README на Github). Мы перенесем в Styx свежие практики из JS MVC, скорее всего сделаем поддержку jquery.form вместо :remote => true (чтобы автоматизировать формы с файлами), добавим дополнительные ивенты (например прогресс аплоада).