1
0
Fork 1
forked from fedi/mastodon

Fix infinite scroll fluidity (#4381)

This commit is contained in:
Eugen Rochko 2017-07-26 23:35:03 +02:00 committed by GitHub
parent a248be4fce
commit 55bee84c97

View file

@ -6,7 +6,7 @@ import StatusContainer from '../containers/status_container';
import LoadMore from './load_more'; import LoadMore from './load_more';
import ImmutablePureComponent from 'react-immutable-pure-component'; import ImmutablePureComponent from 'react-immutable-pure-component';
import IntersectionObserverWrapper from '../features/ui/util/intersection_observer_wrapper'; import IntersectionObserverWrapper from '../features/ui/util/intersection_observer_wrapper';
import { debounce } from 'lodash'; import { throttle } from 'lodash';
export default class StatusList extends ImmutablePureComponent { export default class StatusList extends ImmutablePureComponent {
@ -30,13 +30,13 @@ export default class StatusList extends ImmutablePureComponent {
intersectionObserverWrapper = new IntersectionObserverWrapper(); intersectionObserverWrapper = new IntersectionObserverWrapper();
handleScroll = debounce(() => { handleScroll = throttle(() => {
if (this.node) { if (this.node) {
const { scrollTop, scrollHeight, clientHeight } = this.node; const { scrollTop, scrollHeight, clientHeight } = this.node;
const offset = scrollHeight - scrollTop - clientHeight; const offset = scrollHeight - scrollTop - clientHeight;
this._oldScrollPosition = scrollHeight - scrollTop; this._oldScrollPosition = scrollHeight - scrollTop;
if (250 > offset && this.props.onScrollToBottom && !this.props.isLoading) { if (400 > offset && this.props.onScrollToBottom && !this.props.isLoading) {
this.props.onScrollToBottom(); this.props.onScrollToBottom();
} else if (scrollTop < 100 && this.props.onScrollToTop) { } else if (scrollTop < 100 && this.props.onScrollToTop) {
this.props.onScrollToTop(); this.props.onScrollToTop();
@ -44,7 +44,7 @@ export default class StatusList extends ImmutablePureComponent {
this.props.onScroll(); this.props.onScroll();
} }
} }
}, 200, { }, 150, {
trailing: true, trailing: true,
}); });