@@ -14,6 +14,7 @@ import { FormattedMessage } from 'react-intl'; | |||||
import emojify from '../emoji'; | import emojify from '../emoji'; | ||||
import escapeTextContentForBrowser from 'escape-html'; | import escapeTextContentForBrowser from 'escape-html'; | ||||
import ImmutablePureComponent from 'react-immutable-pure-component'; | import ImmutablePureComponent from 'react-immutable-pure-component'; | ||||
import scheduleIdleTask from '../features/ui/util/schedule_idle_task'; | |||||
class Status extends ImmutablePureComponent { | class Status extends ImmutablePureComponent { | ||||
@@ -92,7 +93,7 @@ class Status extends ImmutablePureComponent { | |||||
const isIntersecting = entry.intersectionRatio > 0; | const isIntersecting = entry.intersectionRatio > 0; | ||||
this.setState((prevState) => { | this.setState((prevState) => { | ||||
if (prevState.isIntersecting && !isIntersecting) { | if (prevState.isIntersecting && !isIntersecting) { | ||||
requestIdleCallback(this.hideIfNotIntersecting); | |||||
scheduleIdleTask(this.hideIfNotIntersecting); | |||||
} | } | ||||
return { | return { | ||||
isIntersecting: isIntersecting, | isIntersecting: isIntersecting, | ||||
@@ -0,0 +1,29 @@ | |||||
// Wrapper to call requestIdleCallback() to schedule low-priority work. | |||||
// See https://developer.mozilla.org/en-US/docs/Web/API/Background_Tasks_API | |||||
// for a good breakdown of the concepts behind this. | |||||
import Queue from 'tiny-queue'; | |||||
const taskQueue = new Queue(); | |||||
let runningRequestIdleCallback = false; | |||||
function runTasks(deadline) { | |||||
while (taskQueue.length && deadline.timeRemaining() > 0) { | |||||
taskQueue.shift()(); | |||||
} | |||||
if (taskQueue.length) { | |||||
requestIdleCallback(runTasks); | |||||
} else { | |||||
runningRequestIdleCallback = false; | |||||
} | |||||
} | |||||
function scheduleIdleTask(task) { | |||||
taskQueue.push(task); | |||||
if (!runningRequestIdleCallback) { | |||||
runningRequestIdleCallback = true; | |||||
requestIdleCallback(runTasks); | |||||
} | |||||
} | |||||
export default scheduleIdleTask; |
@@ -105,6 +105,7 @@ | |||||
"stringz": "^0.2.0", | "stringz": "^0.2.0", | ||||
"style-loader": "^0.16.1", | "style-loader": "^0.16.1", | ||||
"throng": "^4.0.0", | "throng": "^4.0.0", | ||||
"tiny-queue": "^0.2.1", | |||||
"uuid": "^3.0.1", | "uuid": "^3.0.1", | ||||
"uws": "^0.14.5", | "uws": "^0.14.5", | ||||
"webpack": "^2.5.1", | "webpack": "^2.5.1", | ||||
@@ -6510,6 +6510,10 @@ tiny-emitter@1.0.2: | |||||
version "1.0.2" | version "1.0.2" | ||||
resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-1.0.2.tgz#8e49470d3f55f89e247210368a6bb9fb51aa1601" | resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-1.0.2.tgz#8e49470d3f55f89e247210368a6bb9fb51aa1601" | ||||
tiny-queue@^0.2.1: | |||||
version "0.2.1" | |||||
resolved "https://registry.yarnpkg.com/tiny-queue/-/tiny-queue-0.2.1.tgz#25a67f2c6e253b2ca941977b5ef7442ef97a6046" | |||||
to-arraybuffer@^1.0.0: | to-arraybuffer@^1.0.0: | ||||
version "1.0.1" | version "1.0.1" | ||||
resolved "https://registry.yarnpkg.com/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz#7d229b1fcc637e466ca081180836a7aabff83f43" | resolved "https://registry.yarnpkg.com/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz#7d229b1fcc637e466ca081180836a7aabff83f43" | ||||