Подтвердить что ты не робот

Лучшая стратегия использования шаблона HAML с Backbone.js

Im, попадая в Backbone.js, чтобы структурировать код javascript для моего проекта, и мне нравится HAML для шаблонов на бэкэнд (рельсы), поэтому Id нравится использовать его для шаблонов Backbone Views templating. Я знаю, что есть несколько портов HAML для Javascript, например https://github.com/creationix/haml-js, а магистраль поддерживает JST и усы с легкостью.

Каков наилучший способ использования шаблонов haml.

Есть ли недостатки в использовании HAML на стороне клиента? Производительность, дополнительное время загрузки script (позаботились об инструментах упаковки активов, таких как jammit)

4b9b3361

ОТВЕТЫ

Ответ 1

Я знаю, что вы уже упомянули об этом, но я бы предложил использовать haml-js с Джаммитом. Просто включите haml.js в свои javascripts и в свои активы. Добавьте template_function: Haml, а также включите файлы шаблонов в пакет. например.

  javascript_templates:
    - app/views/**/*.jst.haml

Затем в ваших представлениях вы можете включить этот пакет (= include_javascripts :javascript_templates), а Jammit упакует любые файлы .jst.haml в window.JST['file/path']. (Если вы просматриваете источник страницы, вы должны увидеть файл javascript, например <script src="/assets/javascript_templates.jst" type="text/javascript"></script>)

Чтобы использовать эти шаблоны, просто вызовите один из этих JST файлов, созданных Jammit. то есть.

$('div').html(JST['file/path']({ foo: 'Hello', bar: 'World' }));

И Jammit будет использовать функцию функции шаблона Haml-js для визуализации шаблона.

Примечание. Обязательно укажите на github repo Jammit в своем Gemfile, чтобы получить последнюю версию, которая поддерживает символы новой строки, необходимые для работы haml-js.

Ответ 2

Я собираюсь дать haml-coffee выстрел. (не каламбур) Я не могу петь хвалу кофейнику; плюс он по умолчанию теперь в Rails 3.1. Теперь я могу встроить coffeescript в свой любимый язык шаблонов и предварительно скомпилировать партию.

О, радость.. теперь, чтобы заставить его работать.

Ответ 3

Я знаю, что это несколько обходится вокруг вопроса, но здесь мы идем:)

I my rails app Я использую haml для всех просмотров на бэкэнд. Это превосходно. По некоторым причинам (в основном, i18n), я не люблю использовать шаблоны на стороне клиента. Вот как я это делаю:

  • создайте все свои шаблоны в ruby ​​haml и сохраните их в теге script с фанки-типом (я использую text/js-template). Это создаст prerendered html, с которым вы можете играть с jquery и основой.
  • когда вы создаете свои базовые представления, загружаете сохраненный шаблон и добавляете его в свой документ
  • Измените свой вид, изменив существующий шаблон

Вы имеете дело только с html и jQuery для этого потрясающе. Для некоторых представлений, которые не требуют i18n, я использую шаблон подчеркивания, потому что он уже существует.

Как для haml templating performance, кажется, что усы и рули быстрее.

Ответ 4

Я работаю над Rails 3/Backbone-приложением и принял другой подход после оценки hamlbars, haml_assets и играя с haml-js.

Это все твердые драгоценные камни, которые предлагают решения проблемы, каждый из которых имеет определенный набор компромиссов. Например, Haml-js требует, чтобы клиентские стороны создавали шаблоны оформления (в этом нет ничего плохого, это просто компромисс). Hamlbars и haml_assets подключаются к конвейеру активов, но поскольку они существуют вне объекта запроса, некоторые помощники не будут работать. Оба делают некоторые корректировки для этого и включают помощников URL-адресов и помощников ActionView, но не ожидают иметь те же функции, что и запись haml в представлении.

Мой подход несколько громоздкий (я планирую включить его в движок), но он работает хорошо и легко реплицируется. Он использует haml_assets, когда это возможно, но отказывается от обслуживания шаблона из контроллера "шаблонов" с действием "показать"

  • Поместите свои представления в каталог view/templates/
  • Вы можете добавить макет, который отображает это представление в JST-функцию.
  • Вы можете указать действие show для возврата "application/javascript" в качестве своего типа содержимого
  • У вас есть доступ ко всем помощникам при написании шаблонов
  • Вы можете добавить теги script для "/template/whatever", которые будут отображать любой шаблон, или использовать маршрутизацию для более упорядоченных представлений.

Преимущество этого подхода состоит в том, что, поскольку ваши представления доступны из контроллеров, вы можете отображать их как jst-шаблоны (через контроллер шаблонов) или через другие контроллеры как частичные. Это позволит вам обслуживать seo-friendly-страницы непосредственно из url (например,/products/widgets/super-cool-widget), если пользователи могут получить кэшированные шаблоны/шаблоны/виджеты/супер-классный виджет.

Ответ 5

Я не могу ответить inline на поток Craig (я предполагаю, что мне нужна какая-то репутация для публикации на существующих ответах), но вам больше не нужно захватывать вилку jammit для использования haml-js - commit превратил его в основную ветку джаммита. Подробнее см. Здесь: https://github.com/documentcloud/jammit/commit/b52e429f99cac3cd1aa2bf3ab95f1bfaf478d50d

EDIT: последний выпуск gem был в январе, а коммиты были добавлены в марте, так что вам нужно настроить пакет для запуска против репинга github или его локального создания. Если вы не используете HEAD jammit, вам будет сложно получить правильные синтаксические шаблоны, поскольку строки новой строки будут удалены.

Все, что мне нужно было сделать, чтобы настроить это:

1) Добавьте в файл "assets.yml" следующее:

template_function: "Haml"

2) Добавьте источник и шаблоны haml-js, которые я хотел загрузить в файл моих активов: JavaScripts:   ядро:     - public/javascripts/vendor/haml.js   шаблоны:     - app/views/events/_form.haml.jst

3) Убедитесь, что я загружал оба ядра и шаблоны в свой application.html.erb

<% = include_javascripts: core,: templates% >

4) Доступ к шаблонам в моих исходных файлах через JST [имя_файла] (т.е. в этом случае JST ['_ form']). Один из них заслуживает упоминания - jammit будет смотреть на все ваши шаблоны и их имена на общий путь, поэтому, если у вас есть приложение /views/foo/file.jst и app/views/bar/file.jst, вы получите доступ с JST ['foo/file.jst'] и JST ['bar/file.jst']. Если у вас были приложения /views/foo/file 1.jst и app/views/foo/file2.jst, они были бы непосредственно в JST ['file1.jst'] и JST ['file2.jst'], что легко забыть, когда вы начинаете свои первые несколько шаблонов.

Все работало довольно хорошо. Я не знаю, почему Крейгу необходимо определить функцию - я просто использовал функцию Haml по умолчанию, предоставляемую haml.js, но, возможно, я что-то упустил.

Ответ 6

Похоже, https://github.com/netzpirat/haml_coffee_assets дает вам то, что вы хотите. (window.JST шаблоны, написанные в HAML, с встроенной поддержкой coffescript)

Ответ 7

Отъезд Миддлман. Он включает в себя haml, sass, coffee, slim и т.д. Он использует драгоценные камни, такие как рельсы, и обладает множеством других потрясающих функций.

http://middlemanapp.com/

У них даже есть пользовательское расширение для магистрали, https://github.com/middleman/middleman-backbone

Он также позволяет создавать его в статические html, css и js для быстрой загрузки.

Ответ 8

Вы можете попробовать Express с Jade (шаблоны Haml-like). Express построена на Connect для маршрутизации статических файлов. Jade - один из самых быстрых движков шаблонов, которые я пробовал с помощью Node.js

http://expressjs.com/