Most efficient way to render complex table rows?

386 Views Asked by At

I want to make a table of "people", where each of their attributes is inline editable. There are about 500 people, and the list will grow over time. The people#index page contains this list.

Since there are a lot of form elements, the server takes a long time to render the page. The server I'm using to host is also fairly slow, so I thought about making the Javascript doing the rendering of these tables.

Currently, I created a new action to return JSON data of all the people's attributes, and I use Rails to generate just a template for the row. I then use jQuery to clone that template, and insert each attribute from the JSON data into a new copy, and add it to the rows.

This makes people#index load a lot faster, but now I run into the problem of the Javascript freezing up the page for a second while things load.

I looked into web workers for creating a thread to do this work. I plan to generate the extra rows on a separate thread, then add it to my table (I'm using dataTables).

I feel like I might be missing something. That this is a sloppy solution.

My question is, is there a better approach to this?

1

There are 1 best solutions below

3
Eugene Solovyov On BEST ANSWER

Possible options:

1 Pagination I this in this case pagination is the best solution. Pagination can be done on rails side(https://github.com/mislav/will_paginate and https://github.com/amatsuda/kaminari gems) or on js side.

2 You may also use something like http://trirand.com/blog/jqgrid/jqgrid.html This JS component offers ability to inline edit data too and you may search for rails integration gems like https://github.com/allen13/rails-asset-jqgrid