Skip to content

huge performance issues #45

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
aantipov opened this issue Feb 19, 2016 · 13 comments
Closed

huge performance issues #45

aantipov opened this issue Feb 19, 2016 · 13 comments

Comments

@aantipov
Copy link
Contributor

Hi
Currently my app experiences big performance issues when scrolling through the list of items.
Having done some investigation I found out that each scroll event causes 2 digest cycles!!!
Taking into account that each digest cycle runs a lot of watchers (~1000) we are getting an unresponsive app.
It's a very bad idea by itself to do anything on every scroll event, even John Resig long time ago warned against using it http://ejohn.org/blog/learning-from-twitter/
But I wonder why do we need to run digest cycles at all when scrolling?

BTW, I found the way to get rid at list of one redundant digest call.
Look at this function

resizeAndScrollHandler = function() {
  if (!$rootScope.$$phase && !adapter.isLoading) {
    adjustBuffer();
    return $scope.$apply();
  }
};

$scope.$apply(); call here is redundant because adjustBuffer() calls $timeout function, which in its turn calls $scope.$apply();. So we can get rid of $scope.$apply() in the code above.

@mfeingold
Copy link
Contributor

Submit a pull request. This call to $apply is a throwback from the time when in certain use cases there was no calls to timeout. Another thing I keep going back to is to disable scroll handler for as long as there are pending requests

@aantipov
Copy link
Contributor Author

I'd like to submit a pull request, but the problem is that I haven't written in coffee quite a lot of time so I'm not sure about it.
I'm not yet quite into the logic of the code, so I just wanted to know it there any real reason for a use of digest calls while scrolling? Are there cases when we do need them?

@mfeingold
Copy link
Contributor

After a batch of elemens is instantiated, the decision whether more elements are needed or scroller has enough to fill the viewport) is based on the dimensions and positions of the instantiated elements. And this information is only becomes available after the elements are fully instantiated.

@aantipov
Copy link
Contributor Author

Agree. But still didn't get the idea why we need to constantly run digest cycles when scrolling

@mfeingold
Copy link
Contributor

We do not. We just need to cover the entire span the scrolling went through. I think it makes sense to ignore scrolling events after the first one fired. The problem is when to re subscribe. I am playing with the idea of waiting for all pending requests to complete and re subscribe after that. It will not eliminate all redundant requests, but, I hope, will reduce the number of them. And this redundunat scope.$apply definitely should be removed, although I need to double check for edge cases

@nestak
Copy link

nestak commented Feb 29, 2016

Hi,
would it be a good idea to fire this function only when scrolling stops for a while?
Something like:

var postponed = null;
resizeAndScrollHandler = function() {
  clearTimeout(postponed);
  postponed = setTimeout(proceed, 100);

  function proceed () {
    if (!$rootScope.$$phase && !adapter.isLoading) {
      adjustBuffer();
      return $scope.$apply();
    }
  }
};

@dhilt
Copy link
Member

dhilt commented Mar 3, 2016

@aantipov I've double checked and commited your redundant digest call fix, thank you.

@nestak It's an interesting idea but there are some potentialy bad points I see. 1st is that this delta (100ms) affects the UI response. 2nd is that the size of this delta is empirical data -- if you make it too small then scroll events will be fired in-between user' scrollings -- and I guess it also may depends on browser' realization... anyway this idea requires additional research... thanks!

@aantipov
Copy link
Contributor Author

aantipov commented Mar 4, 2016

@dhilt

I've double checked and commited your redundant digest call fix, thank you.

you commited it to dist/ui-scroll.js, not to src/ui-scroll.js :)
BTW, this change break the tests, so I'm not sure we can do it

@dhilt
Copy link
Member

dhilt commented Mar 4, 2016

yeah, thanks for this note; i've recommited this fix; it includes also a simple test fix

@aantipov
Copy link
Contributor Author

aantipov commented Mar 4, 2016

Cool!

@observstream
Copy link

I have committed a potential fix for the performance issues by attaching the check to an interval running every 100 milliseconds instead of on the scroll event (about every 6-10 milliseconds).

@aantipov
Copy link
Contributor Author

aantipov commented Mar 7, 2016

As for me - the decision looks fine. I just added several notes to the PR. But we do need to test it thoroughly.
Also may be is it worth to change interval time to a smaller value, say 80ms?

Anyway, we need to hear a word from @mfeingold and @dhilt

@mfeingold
Copy link
Contributor

fixed in #66

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants