Canonical Way to use JQueryUI Autocomplete with Meteor

Question

Using Meteor, I'd like to understand the most efficient way to use JQuery UI's Autocomplete with large volumes of server-side data.

I have two working proposals and would like to hear opinions on the differences and if there are any better ways to do the same thing.

Using pub/sub:

// Server
Meteor.publish("autocompleteData", function (theSearchTerm) {
  var query = {
    name: { $regex: theSearchTerm, $options: 'i'}
  };

  return MyData.find(query, options);
});

// Client
Template.myTemplate.rendered = function() {
  initAutocomplete($(this.find('.my.autocomplete')));
};

var initAutocomplete = function(element){
  element.customAutocomplete({
    source: function(request, callback){
      var sub = Meteor.subscribe('autocompleteData', request.term, function(){
        var results = MyData.find({}, {limit: 50}).fetch();
        sub.stop();
        callback(results);
      });
    },
    select: function(event, ui){
      // Do stuff with selected value
    }
  });
};

Using remote functions (Meteor.Methods):

// Server
Meteor.methods({
  getData: function(theSearchTerm) {
    var query = {
      name: { $regex: theSearchTerm, $options: 'i'}
    };

    return MyData.find(query, {limit: 50}).fetch();
  });
});

// Client
Template.myTemplate.rendered = function() {
  initAutocomplete($(this.find('.my.autocomplete')));
};

var initAutocomplete = function(element){
  element.customAutocomplete({
    source: function(request, callback){
      Meteor.call('getData', request.term, function(err, results){
        callback(results);
      });
    },
    select: function(event, ui){
      // Do stuff with selected value
    }
  });
};

Which, if either, is the the most efficient way to setup a server-side autocomplete using Meteor with a large dataset?

Answer 1

For what it's worth, I'll offer a few of my thoughts on the subject. As a disclaimer, I'm just a Meteor enthusiast and not an expert, so please correct me if I've said something faulty.

To me, it seems like a potential advantage of pub/sub in cases like these is that data is cached. So when subscribing to the same record set, lookup will be near instantaneous since the client can search the local cache instead of asking the server for data again (publication is smart enough not to push repeated data to the client).

However, the advantage is lost here since you're stopping the subscription, so every time the user types the same search term, data is again pushed to the client (at least, the cursor's added event fires again for every document). In this case I would expect the pub/sub to be on nearly equal footing with Meteor.call.

If you want to cache the data of pub/sub, one way is to take out the sub.stop(). But unless your users have the tendency to search similar terms, caching the data is actually worse since with every letter the user types more data will be stored on the client, perhaps never to be seen again (unless searching is such a prominent feature in your app that the user would benefit from this?).

Overall, I see no compelling advantage with using pub/sub over Meteor methods, though I'm not versed in Meteor well enough to offer more specific advantages/disadvantages between the two. I personally think Meteor methods looks cleaner though.

If you're trying to implement a search feature though, I personally like the easy-search package, which supports this type of server-side search with autocomplete. In any case, I hope you get your question resolved! I'm curious to know the answer too.