Лучший способ построить HTML из JSON

1

Я пытаюсь создать POC, чтобы перенести тяжелое приложение JSF в приложение aachax/restful без атак. В процессе я не могу решить, какой лучший способ представить данные JSON, возвращаемые на экран, я вижу два основных подхода: нужно иметь шаблоны и использовать с ними что-то вроде прототипа toHTML(), а другое - строить объекты в javascript, а затем использовать appendchild. первый из них гораздо легче понять для нового человека, который должен поддерживать код, поскольку шаблоны очень понятны и проще в обслуживании (все навыки, необходимые для изменения html в шаблонах, ниже), но из того, что я понимаю, appendchild метод лучше в отношении скорости браузера.

Какой предпочтительный способ справиться с этим, и я не вижу других точек сравнения между ними? добавить ребенка - это хороший компромисс между этими двумя? есть ли другие способы сделать это?
P.S: чтобы быть ясным, я говорю только о клиентских манипуляциях

Теги:

1 ответ

1
Лучший ответ

Настройка html напрямую с помощью innerHTML является самым быстрым способом кросс-браузера. У этого есть некоторые ошибки, однако вы должны иметь в виду (таблицы, формы и т.д.).

var html = [];

for (...) {
  html.push( PARTIAL_HTML );
}

element.innerHTML = html.join("");

ОБНОВЛЕНИЕ: Лучший способ - проверить его самостоятельно:

function test( name, fn, n, next ) {

  var n = n || 100; // default number of runs
  var start, end, elapsed;

  setTimeout(function() { 
    start = Number(new Date());   
    for ( ; n--; ) {
      fn() 
    }
    end = Number(new Date());

    elapsed = end - start;

    // LOG THE RESULT
    // can be: $("#debug").html(name + ": " +  elapsed + " ms");
    console.log(name + ": " +  elapsed + " ms")); 

    next && next();
  }, 0);
}

test("dom", function() {
  // ...
});

test("innerHTML", function() {
  // ...
});
  • 0
    Привет, innerhtml Скамейке 2 года, я не знаю, так ли это до сих пор ..?
  • 0
    Я знаю, что это так, но если вы не уверены, что всегда можете сделать тест самостоятельно, посмотрите мое обновление.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню