Summary: fix slowness due to layout thrashing when reloading a large … (#12661)

[mastodon.git] / app / javascript / mastodon / components / intersection_observer_article.js

diff --git a/app/javascript/mastodon/components/intersection_observer_article.js b/app/javascript/mastodon/components/intersection_observer_article.js
index e453730ba4fccd4ac4034e6c4addc9171736d929..d475e5d1c0392befa623c6d6670828b6416146bd 100644 (file)
--- a/app/javascript/mastodon/components/intersection_observer_article.js
+++ b/app/javascript/mastodon/components/intersection_observer_article.js
@@ -20,6 +20,8 @@ export default class IntersectionObserverArticle extends React.Component {
     cachedHeight: PropTypes.number,
     onHeightChange: PropTypes.func,
     children: PropTypes.node,
+    currentlyViewing: PropTypes.number,
+    updateCurrentlyViewing: PropTypes.func,
   };
 
   state = {
@@ -48,6 +50,8 @@ export default class IntersectionObserverArticle extends React.Component {
     );
 
     this.componentMounted = true;
+
+    if(id === this.props.currentlyViewing) this.node.scrollIntoView();
   }
 
   componentWillUnmount () {
@@ -60,6 +64,8 @@ export default class IntersectionObserverArticle extends React.Component {
   handleIntersection = (entry) => {
     this.entry = entry;
 
+    if(entry.intersectionRatio > 0.75 && this.props.updateCurrentlyViewing) this.props.updateCurrentlyViewing(this.id);
+
     scheduleIdleTask(this.calculateHeight);
     this.setState(this.updateStateAfterIntersection);
   }