Meteor performance issue or reactive-table issue?

Hi,
I am playing around with a Meteor based web app. I created 5000 fake users using Accounts.createUser() method (actually it took about 3-4 minutes to finish creating the users, I have a i7 with 8 GB RAM, is it normal?) and I am displaying some data for the users using the lovely reactive-table package. Works fine for a few users, but for 5000 looks like my browser is blocked as soon as I go to the page showing the table… I have no clue if this is normal for this scenario or is because reactive-table is not supposed to work with such large number of objects (5000 sounds kind of not-that-much) or it’s just that my code sucks. So I have these questions for you, Meteor experts:

  1. Is it mandatory to actually user server side pagination in this case? Is 5000 user objects too much for Meteor?
  2. reactive-table is not supposed to work with such large numbers? Should I quit wanting “reactivity” for this table and just add some search which calls some server single user publishing?
  3. Is my code somehow stupid? Here it is:

page template:

<div class="panel-body">
  {{> reactiveTable class="display table table-bordered dataTable" collection=usersCol settings=settings}}
</div>

publish all users

Meteor.publish('AdminUsers', function() {
	if (this.userId != null) {
		var user = Users.findOne({
			_id: this.userId
		});

		if (Roles.userIsInRole(user, ["admin"])) {
			return Users.find({}, {
				fields: {
					emails: 1,
					profile: 1,
					roles: 1
				}
			});
		}
	}
});

template snippet

<div class="panel-body">
                        {{> reactiveTable class="display table table-bordered dataTable" collection=usersCol settings=settings}}
 </div>

Why do you need a list of 5000 users or anything else on the client? You should use server side for this.

I need to edit users on the client, having the role “admin”. So server side pagination is the only way to go, right?

reactive-table doesn’t do well with large data sets because it doesn’t dynamically manage pub/sub for you. My tabular package may work better for your use case.

4 Likes

Reactive-table has server side as a beta feature.

My personal experiance with datatables is not the best. It´s very powerful, but if you need to do complex filters, edits, rules, … you perhaps will spend more time with the tool than you would if you did everything yourself from the start.

If you don´t need a pagination you can think about implementing infinite scroll and server side yourself. It´s not complicated.

Thanks Aldeed for the tabular suggestion. I am already using some of your awesome packages, I’m gonna try asap also this one. By looking quickly at the readme, looks like exactly what I need. BTW, do you also have any demo apps for it? Just asking, the docs are quite good anyway.

Hey Benjamin, infinite scroll is not good for me here, I need a table. In the beginning I just wanted to create a table and add rows to it using template helpers, but not sure how to make it reactive…

You can do an infinite scroll table just by wrapping the <tr> in your #each and subscribing to an additional N documents when scrolled to the bottom. For simple cases, you don’t necessarily need tabular or any other package. The problem is usually you then end up needing to add search, filter, sort, etc. and in the end, you might wish you had just used DataTables.

I agree with @benjamin79, though. It’s easy enough to use the tabular pkg, but you then have to commit to fully understanding the DataTables API, too, which is huge (though well documented).

I definitely need search and filter, so probably it would take to much to do it myself. It might not be needed to read the whole DataTables API, your documentation is already helpful :slight_smile:

Hi,
As you could notice it is a popular solution to use pagination when dealing with a large lists. Even ‘moster’ web apps like gmail or amazon do it. It is better to limit a portion of data and create a filters on the server side. It is bit complicated but it just works and do not require heavy client side memory usage or DOM rendering. Also I think that tables aren’t good solution for lists. A lot of UX engineers advice to avoid of tables.

Thanks mrzafod for the suggestion. I agree that normally tables are not the nicest things from UX point of view. But I have to list a large number of users, a column with Edit and Delete for each, search, etc. In this case I cannot think of a better solution…

Hey @aldeed, I tested eventually your Tabular package, I gotta say it’s a perfect fit for me. Has the cool DataTables options, server pagination. Works like a charm! Thanks for an awesome package…

@vicusbass, do you mind publishing a short example of how you are using the Tabular package? It would be very useful for me

@aldeed How would you go about rerendering a tabular table? Any method to call? Or is invalidating the template it’s in the only option?

Got a side navigation bar that’s collapsable therefore need tabular tables adjust their width accordingly.

@bruparel, nothing special, just a table definition in common code and a Handlebars in a template. Take a look at the official example here: Example on the Github page