Как правильно хранить шаблоны для Backbone моделей?

Question

[Станислав Почепко]

Озадачиваюсь вопросом, как правильно организовать подгрузку шаблонов для моделей backbone. Видел пример, когда Ajax'ом вытягиваются шаблоны с сервера в виде статически .html страниц, а в модели попросту храниться URL путь, где лежит этот шаблон. Правильный ли это способ? Поделитесь, как вы храните свои шаблоны?

Answer 1

[Константин Китманов]

Ну для начала — хранить шаблоны в моделях вообще неправильно. Про свои шаблоны должны знать только вьюхи.

Если у вас сборка организована с помощью browserify, то шаблоны можно компилировать на лету при сборку и во вьюхах писать просто типа такого:

render: () {
    this.$el.html(require('templates/template.jade')())
}

Comments

[Станислав Почепко]

А я не говорил, что я их собираюсь хранить в моделях.
"в модели попросту храниться URL путь, где лежит этот шаблон."

[Константин Китманов]

Станислав Почепко: вы либо путаете модели со вьюхами опять, либо глубоко заблуждаетесь.

[Станислав Почепко]

Константин Китманов: Шаблон - это и есть view, которая еще не отрендерина. не так ли?

[Алексей Уколов]

Нет, не так...

[Константин Китманов]

Станислав Почепко: Вы документацию что ли до конца не просмотрели?:) backbonejs.org/#View

[Алексей Уколов]

View - это набор логики для какого-то куска DOM, вот этот кусок - это и есть шаблон. Что вы будете делать, если одну и ту же модель нужно будет вывести в трех местах по разному?

[Станислав Почепко]

Константин Китманов: Я видимо не правильно выразился. Я не беру в счет её функциональные возможности. Это то понятно, что она рендерится по переданным параметрам от модели. Но связь же идёт такая Model-View-Tempalte.

[Константин Китманов]

Станислав Почепко: вот Алексей Уколов правильно сказал: шаблон — это тупо строка, и модели нельзя знать ничего про тот DOM, в котором она будет отрендерена. За шаблон отвечает только Backbone.View.

[Станислав Почепко]

В общем то мы немного отошли от сути вопроса.
Я ещё предполагаю вириант, когда на стороне сервера лежит view общая. То есть теги соотвествуют для шаблонизатора и серверного и клиентского. И на сервере сначала рендерится страница полностью. То есть Backbon во время загрузки страницы никакие запросы не делает, но он подхватывает сразу View уже вставленные в DOM, а потом уже работает с готовыми наборами и по требованию он может запросить дополнительные шаблоны с сервера, которые в свою очередь будут отдаваться через определённый интерфейс уже сервера.

[Алексей Уколов]

Станислав Почепко: Связь действительно такая, но она не двусторонняя - View знает про Model и Template, но Model иTemplate не знают ни о ком, кроме самих себя.

[Константин Китманов]

Станислав Почепко: это уж как хотите. Только не путайте шаблон со вьюхой, и все у вас получится.

Answer 2

[Алексей Уколов]

Как и везде в программировании, в данном случае нет "правильного" или "неправильного" способа. Все зависит от ващих задач, каждый способ имеет сильные и слабые стороны в зависимости от них.

Я собираю в переменную при помощи grunt и подгружаю js-файл с ними при старте страницы (это в режиме разработки, конечно, на продакшене все скрипты собираются в один файл).
Это позволяет компилировать на сервере, то есть шаблоны работают быстрее (вопрос о том, насколько быстрее они работают, остается открытым). При таком подходе, конечно, грузятся вообще все шаблоны, часть из них может вообще не пригодиться, для избежания этого как раз и загружают их по требованию, когда они реально нужны. Но это добавляет элемент асинхронности - нужно обрабатывать загрузку шаблона, показывать спиннер в интерфейсе и т.п.

Comments

[Станислав Почепко]

Ну на счёт ассинхроности это не проблема. Я хочу использовать backbon для админки.

[Алексей Уколов]

Я и не говорил, что это проблема, просто дополнительное усложнение кода. Если у вас файл с шаблонами весит меньше X кб имеет смысл забить на загрузку по требованию и упростить код. Число X определяется исходя из вашего приложения и его аудитории. Для админки, на мой взгляд, оно может быть достаточно большим - администраторы могут при первой загрузке подождать дополнительные пару секунд.