Это мой первый набег на шаблоны на стороне клиента, и я хочу убедиться, что я понимаю его и правильно его использую. После прочтения этого инженерного блога LinkedIn я решил пойти с dust.js, а не усы или handlebars. Обратите внимание, что этот postoverflow post ответил на многие мои вопросы, но у меня все еще есть несколько вещей, которые я хочу уточнить.
В среде, в которой я работаю, у меня нет доступа к чему-либо на стороне сервера, поэтому все, что я создаю, должно полностью работать в клиентском браузере. В этом примере я попытаюсь воссоздать этот пример кода из Учебное пособие по LinkedIn Dust.
Я включаю dust-full.js, а не dust-core.js, потому что я собираюсь скомпилировать шаблон на лету:
<script src="js/dust-full.js"></script>
Вот HTML:
<script id="entry-template">
{title}
<ul>
{#names}
<li>{name}</li>{~n}
{/names}
</ul>
</script>
<div id="output"></div>
И JavaScript (с использованием jQuery):
$(document).ready(function () {
var data = {
"title": "Famous People",
"names" : [{ "name": "Larry" },{ "name": "Curly" },{ "name": "Moe" }]
}
var source = $("#entry-template").html();
var compiled = dust.compile(source, "intro");
dust.loadSource(compiled);
dust.render("intro", data, function(err, out) {
$("#output").html(out);
});
});
Кажется, что все работает отлично, как вы можете видеть в этот jsfiddle.
Несколько вопросов:
-
Почему шаблон должен содержаться в тегах script? Почему бы просто не включить его в div с id = "entry-template", а затем заменить html внутри этого во время dust.render(), как в этот измененный скрипт?
-
Что делает dust.loadSource(скомпилировано); "делать? В docs говорится:" Если вы включили "скомпилированную" строку как часть блока script JS, который вы загружаете, тогда будет определен и зарегистрирован шаблон "intro". Если вы хотите сделать это немедленно, тогда "назовите его, однако я не понимаю, что это значит. Я заметил, что если я удалю эту строку, тогда это не сработает, поэтому я хотел бы это понять.
-
После того, как я доволен своим шаблоном и завершаю его, как мне его скомпилировать, чтобы импортировать более легкую dust-core.js, а не компилировать ее браузером на каждую загрузку страницы? Есть ли существенное преимущество для этого или я должен оставить, как есть, с помощью dust-full.js?
-
В общем, похоже ли это как подходящий/полезный способ реализации пыли (или любой шаблонной схемы, если на то пошло), или я просто где-то далеко?
Спасибо заранее.
