ar
/
mastodon
forked from treehouse/mastodon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Improve IntersectionObserverArticle perf (#5152)

rebase/4.0.0rc2
Nolan Lawson 2017-09-30 05:28:49 -07:00 committed by Eugen Rochko
parent 83ffc4dc07
commit ca0e8be20c
1 changed files with 21 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
app/javascript/mastodon/components/intersection_observer_article.js
View File

@ -58,26 +58,31 @@ export default class IntersectionObserverArticle extends React.Component {
} }
handleIntersection = (entry) => { handleIntersection = (entry) => {
const { onHeightChange, saveHeightKey, id } = this.props; this.entry = entry;
if (this.node && this.node.children.length !== 0) { scheduleIdleTask(this.calculateHeight);
// save the height of the fully-rendered element this.setState(this.updateStateAfterIntersection);
this.height = getRectFromEntry(entry).height; }
if (onHeightChange && saveHeightKey) { updateStateAfterIntersection = (prevState) => {
onHeightChange(saveHeightKey, id, this.height); if (prevState.isIntersecting && !this.entry.isIntersecting) {
} scheduleIdleTask(this.hideIfNotIntersecting);
} }
return {
isIntersecting: this.entry.isIntersecting,
isHidden: false,
};
}
this.setState((prevState) => { calculateHeight = () => {
if (prevState.isIntersecting && !entry.isIntersecting) { const { onHeightChange, saveHeightKey, id } = this.props;
scheduleIdleTask(this.hideIfNotIntersecting); // save the height of the fully-rendered element (this is expensive
} // on Chrome, where we need to fall back to getBoundingClientRect)
return { this.height = getRectFromEntry(this.entry).height;
isIntersecting: entry.isIntersecting,
isHidden: false, if (onHeightChange && saveHeightKey) {
}; onHeightChange(saveHeightKey, id, this.height);
}); }
} }
hideIfNotIntersecting = () => { hideIfNotIntersecting = () => {