Loading large data in jquery

I have a web service that returns data, quite a large set, could be 600 rows, by 20 columns. What is the fastest most efficient way to load this data into an html table in Jquery code?

I tried creating the table html by looping through the data returned and creating a table DOM inside a string, but the looping part is very slow. I have heard of Jquery Templates, but I am not sure this technology is fast enough for large sets of data....

Thanks

---

Is it possible for you to alter the web service or have another service call it and parse the data server side and return HTML? Processing the JSON on the client-side is going to be your bottleneck. If you can have the service return the required HTML to you, then it's a simple element.html(data) on the client side.

Edit: The question of returning JSON or HTML and the pros and cons of each have been discussed here quite a bit: 1, 2, 3, 4, 5

---

It seems this is a matter of design. loading 600 x 20 data items at once is not a good idea. Consider clients with low system resources like pocket PCs or TCs (thin client) would suffer to visit such a page.

You need to cache webservice data and load it in chunks into client browser based on the user action. You can use some Ajax controls to do so.

---

If your goal is to have the user be able to interact with the data as fast as possible, may be you want to consider something like infinite scroll (also called continuous scroll) pattern so you build the grid as needed from the scrolling of the user and not spend the whole time rendering the grid upfront.

Some links:

http://www.infinite-scroll.com/

http://net.tutsplus.com/tutorials/javascript-ajax/how-to-create-an-infinite-scroll-web-gallery/

链接地址: http://www.djcxy.com/p/47894.html

上一篇: 在PHP JSON响应中返回HTML

下一篇: 在jquery中加载大量数据