Basic AngularJS live search behaving erratically - ruby-on-rails

Question

In my angular-rails app I'm trying to implement a very basic live database search, such that on keyup, a results array populates or depopulates as the input value changes. Currently there are around 400 products in the database table, but there could be many more in the future. Here's my code:
On Rails side, inside products controller:
def index
#products = Product.search(params[:search]);
render json: #products
end
And my product.rb file:
def self.search(search)
where("name iLIKE ?", "%#{search}%")
end
While on the angular side, inside the relevant controller:
function MainController(dataService) {
var ctrl = this
ctrl.searchResultsArray = [];
ctrl.populateArray = function(search) {
dataService.getProductSummaries(search)
.then(function(response){
ctrl.searchResultsArray = response.data
})
};
};
Inside my dataService:
function dataService($http) {
var ctrl = this
ctrl.getProductSummaries = function(search) {
return $http({
method: 'GET',
url: '/products',
params: { search: search }
});
};
};
And inside my angular view (controlled by MainController as ctrl):
<input ng-keyup="ctrl.populateArray(ctrl.result)" ng-model="ctrl.result" />
<div ng-repeat="result in ctrl.searchResultsArray">
<li>
{{ result.name }} costs {{ result.price }}
</li>
</div>
The above code mostly works, but typing too quickly can shortcircuit it, and I occasionally see errors in my dev console, so it definitely is broken. What is it missing or doing wrong?

Answer 1

So, since you expect issues with too quickly type - im not sure you have real errros in console. Most likely you see canceled status code, because you've initiated new query to same url as before.
However, here is couple tricks i can advice to make your queries faster:
You can start requests only when user input 3+ symbols.
Think about .limit(n) in your rails controller. Depending on business requirements you can/cannot limit amount of returned matches from controller.
As i see you only need name and price fields of your Product model. So you can shrink response size. You can use any json builder gem, like jbuilder, or simply try something like that json: #products.select(:name, :price) - it will export only selected columns from database.
To speedup DB queries you can add index to name column.