Лучший способ создать большие статические элементы DOM в JavaScript?

У меня есть много элементов, которые один из моих виджетов JS должен создавать и часто добавлять в DOM. Они никогда не меняются.

Таким образом, один из вариантов — сохранить сам HTML в виде строки в JS и использовать JQuery для создания элементов из строки, а затем добавить их в документ:

var elements = "<div><table><tr><td>1</td><td>2</td></tr></table></div>";
function create() {
  return $(elements);
}
$("body").append(create());

Другой вариант — написать функцию, которая будет использовать документ .createElement("div") или $("

function create() {
  return $("<div>").append($("<table>")......
}
$("body").append(create());