Question

我正在尝试构建一个POC来将繁重的JSF应用程序迁移到无状态的ajax / restful应用程序。在进程中我无法确定呈现返回到屏幕的JSON数据的最佳方式是什么，我可以看到两个主要方法是使用模板并使用类似原型的toHTML（）和其他内容来构建javascript中的对象然后使用appendchild。对于需要维护代码的新人来说，第一个更容易理解，因为模板非常清晰且易于维护（所有更改模板中的html所需的技能都较低）但是从我理解的附加项方法在浏览器速度方面更好。

处理这个问题的首选方法是什么？我错过了两者之间的其他比较点吗？ append child这是两者之间的妥协吗？还有其他办法吗？
P.S：要清楚我只谈论客户端操作

Answer 1

直接使用 innerHTML is the fastest 方式跨浏览器设置html。但是，它有 some bugs ，你应该记住（表格，表格等）。

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() {
  // ...
});

从json构建HTML的最佳方法

1 个答案: