ElasticUI icon indicating copy to clipboard operation
ElasticUI copied to clipboard

Preventing unnecessary searches while indexVM is still in flux

Open maxmelnick opened this issue 10 years ago • 2 comments

Many times in loading a search page, multiple calls to elasticsearch are made while things are still being configured (e.g., add a sort, aggs, filters, etc.). This makes multiple $watch statements in the IndexController fire.one after the other. Instead, I found it useful to leverage underscorejs/lo-dash's _.debounce method as such to minimize the amount of times the search() method is called while things are still being configured:

var lazySearch = _.debounce(function(){
                    _this.search();
                }, 300);

                $scope.$watchCollection('indexVM.filters.ejsObjects', function() {
                    _this.indexVM.page = 1;
                    lazySearch();
                });
                $scope.$watchCollection('indexVM.aggregationProviders.objects', function() {
                    return lazySearch();
                });

                $scope.$watch('indexVM.host', function() {
                    if (_this.indexVM.host != null && es.setHost(_this.indexVM.host)) {
                    lazySearch();
                    }
                });
                $scope.$watch('indexVM.sort', function() {
                    _this.indexVM.page = 1;
                    lazySearch();
                });
                $scope.$watch('indexVM.page', function() {
                    return lazySearch();
                });
                $scope.$watch('indexVM.index', function() {
                    return lazySearch();
                });
                $scope.$watch('indexVM.query', function() {
                    return lazySearch();
                });
                $scope.$watch('indexVM.highlight', function() {
                    return lazySearch();
                });

maxmelnick avatar Sep 10 '14 00:09 maxmelnick

Hi Max,

I've recognizezd this problem earlier which is why in https://github.com/YousefED/ElasticUI/blob/master/src/controllers/IndexController.ts there's a timeout of 200ms to set "loaded". I agree debouncing is probably a nicer way.

In the ideal situation we'd be able to detect when the page has fully loaded and angularjs is in a "stable" state to issue the first request. However, this seems to be a challenge with Angular. Any ideas on this?

YousefED avatar Sep 10 '14 07:09 YousefED

Is there a way to have each directive attach a "loading" variable to the rootscope and monitor it that way?

I'll do some additional searching to see what other ideas people might have.

maxmelnick avatar Sep 16 '14 02:09 maxmelnick