Javascript кажется медленным в создании HTML-таблицы из JSON

Question

Есть ли способ ускорить способ, которым следующий javascript создает HTML-таблицу из json?Следующий код возвращает json приблизительно из 1000 строк и 10 столбцов, но для построения html-таблицы требуется около 10 секунд.

Сначала я попытался скрыть элемент, чтобы увидеть, является ли это проблемой рендеринга с использованием document.getElementById("data-tableResults").style.display = "none";, ноэто занимает столько же времени.

Javacript не мой родной язык, но кажется, что он слишком медленный?

Ajax Post Request:

        currentRequest = $.ajax({
            type: 'POST',
            url: "../DataBuilder/Index",
            data: JSON.stringify({ dataObj: getData() }),
            success: function (returnPayload) {

                tableResults = returnPayload["data"];

                // Slow from here
                // document.getElementById("data-tableResults").style.display = "none";
                buildTableResults();
                // document.getElementById("data-tableResults").style.display = "block";
                console && console.log("request succeeded");

            },
            error: function (xhr, ajaxOptions, thrownError) {

                console && console.log("request failed");


            },
            dataType: "json",
            contentType: "application/json",
            processData: false,
            async: true
        });

Таблица сборкиfunction <- Это очень медленно </strong>

    buildTableResults = function() {
        var tbody = $('#data-tableResults tbody'),
            props = ["field1", "field2", "field3", "field4", "field5", "field6", "field7", "field8", "field9", "field10"];
        tbody.empty();
        $.each(tableResults, function(i, reservation) {
            var tr = $('<tr>');
            $.each(props, function(i, prop) {
                $('<td>').html(reservation[prop]).appendTo(tr);
            });
            tbody.append(tr);
        });
    };

Редактировать:

Я также пытался создать таблицу вне DOM, а затем заменить ее, но не могузаставить это работать.

    buildTableResults = function () {
        var table = $('<table>', { id: 'data-tableResults' })
        var tbody = table.children('tbody'),
            props = ["field1", "field2", "field3", "field4", "field5", "field6", "field7", "field8", "field9", "field10"];
        tbody.empty();
        $.each(tableResults, function(i, reservation) {
            var tr = $('<tr>');
            $.each(props, function(i, prop) {
                $('<td>').html(reservation[prop]).appendTo(tr);
            });
            tbody.append(tr);
        });

        $('#data-tableResults').replaceWith(table);
    };