Как лучше всего создавать блоки из данных?

Question

[Extramezz]

Есть такой HTML:

<template id="ctmp">
  <div>
    .........Куча дочерних и вложенных в них элементов.......
  </div>
</template>
<div id="dump">
  <!--Блок для вывода-->
</div>

Я получаю данные JSON - текст, названия, ссылки, в общем, все это я обрабатываю примерно так:

var cloneNode = $(ctmp.content.children[0]);
//Получил json
var newBox = document.createDocumentFragment();
json.forEach(function(article){
  var newArticle = cloneNode.clone();
  cloneNode.find(".contentBox").text(article.text);
  cloneNode.find(".contentTitle").text(article.name);
  //И примерно 10 подобных манипуляций
  newBox.appendChild(cloneNode);
}
dump.appendChild(newBox);

В общем, на перебор и создание 50 новых блоков уходит 500-700мс, не скажу, что это много, меня интересует другое - верен ли мой поход? Может быть, вы как-то проще организуете данные вещи? К примеру, работаете не с элементом, а с HTML-кодом и просто заменяете нужные части с помощью replace?

Answer 1

[Денис Инешин]

Воспользуйтесь шаблонизатороми, лучший способ превратить JSON-данные в HTML, максимально оптимизировано.
- Handlebars.js
- Dust.js

Answer 2

[nozzy]

я бы попробовал заменить clone() на html.
вот тест - jsfiddle.net/dzul1983/vB8Fn/2