Html Question posted in
Some basic documentation can be found here.

Html – Faster way to create tables with JS?

I am trying to us Fuse to create a front-end search for a JSON database. Fuse is very fast, but I can’t figure out how to write the table to the HTML in a speedy way.

I have tried pure JS:

      for (row in resultsArray){
        dRow = resultsArray[row]
        table.innerHTML += "<tr>" + "<td>" + dRow["item"]["title_translit"] + "</td>" + "<td>" + dRow["item"]["translator"][0]["name_translit"] + "</td>" + "</tr>"
      }
      /*
      jQuery.each(resultsArray, function(idx, row) {
        table.innerHTML += "<tr>" + "<td>" + row["item"]["title_translit"] + "</td>" + "<td>" + row["item"]["translator"][0]["name_translit"] + "</td>" + "</tr>"
      })
      */
    };

As well as jQuery:

      jQuery.each(resultsArray, function(idx, row) {
        table.innerHTML += "<tr>" + "<td>" + row["item"]["title_translit"] + "</td>" + "<td>" + row["item"]["translator"][0]["name_translit"] + "</td>" + "</tr>"
      })

But in both cases, it takes a few seconds to write the array of dicts (which is about 2,000 rows in total) to HTML tables. Is there a faster way to do this?

Tags:

2

Answers


  1. 0

    Maybe you can use datatables pluguin and load data via async ajax call, that load first DOM and later on the data link to doc

    Login or Signup to reply.
  2. 0

    There are so many ways to do this task, You can use javascript DOM, also refer to this answer.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search