Это хорошая абстракция, которая подходит для инженеров на стороне клиента, чтобы понять, как DOM построен и модифицирован. В этом отношении он «чище», потому что есть одна ментальная модель. Это также хорошо, потому что нам не нужно смешивать множество разнородных синтаксисов из языка шаблонов поверх чистой декларативной разметки, как в случае с самой «глупой» системой шаблонов, такой как усы.
Я бы не сказал, что более эффективно использовать jsdom для шаблонов. Посмотрите на google wrt, например, на «утечки памяти с помощью jsdom». jsdom - это rad, и он очень полезен для таких задач, как проекты выходного дня, для обхода сайтов, выполнения задач, не связанных с сервером, но я думаю, что это слишком медленно с точки зрения высокопроизводительного веб-сервера.
Существует миллиард способов это учесть. Ни один метод не появился как «стандартный» способ. Один из способов, который я видел, - это отправить пустой «шаблон», то есть блок html, который каким-то образом представляет модель, а затем использовать его для начальной загрузки построения конечного представления из модели. Из этой статьи, например:
<li class="contact" id="contact-template">
<span class="name"></span>
<p class="title"></p>
</li>
Это «вид» в классическом отношении. В типичном веб-приложении это может выглядеть примерно так:
<li class="contact">
<span class="name"><?= $name ?></span>
<p class="title"><?= $title ?></p>
</li>
Чтобы использовать mvc, нужно настроить контроллер, который смутно знает о семантике вышеприведенного представления и модели, которую он представляет. Это представление анализируется в / a DOM и доступно через ваш любимый механизм выбора. Каждый раз, когда модель представляет изменения, вы можете использовать события изменения или обратные вызовы для обновления представления. Например:
Давайте представим, что «модель» запускает событие «изменение» каждый раз, когда изменяется свойство.
controller = new Controller({
view: $('#contact-template').clone(), // Assume jquery or whatever
model: aContact
});
// Assume some initialization that sets the view up for the first time
// and appends it to the appropriate place. A la:
// this.view.find('.name').text(model.name);
// this.view.find('.title').text(model.title);
// this.view.appendTo('#contacts')
controller.on('model.name.change', function(name){
this.view.find('.name').text(name);
});
Это то, что системы типа Weld и Backbone.js делают для вас. Все они имеют разную степень предположений о том, где эта работа выполняется (на стороне сервера, на стороне клиента), какую среду вы используете (jquery, mootools и т. Д.) И как распределяются ваши изменения (REST, сокет). и т. д.).
Редактировать
Некоторые действительно полезные вещи, которые вы можете сделать с jsdom, вращаются вокруг интеграционного тестирования и паутинга:
Лично я хотел бы увидеть проект, который использовал подход Тоби, но сопоставил его с чем-то вроде https://github.com/LearnBoost/soda таким образом, чтобы мы могли проводить тестирование селена на основе облачных вычислений без селена (поскольку imo это отстой) .