data.coop/pinafore
8
0
Fork 0
Code Issues 1 Pull requests Packages Projects Releases Wiki Activity

perf: fix potential memory leak in IntersectionObserver (#1383)

Browse source
This commit is contained in:
Nolan Lawson 2019-08-11 11:09:43 -07:00 committed by GitHub
parent 66b247875f
commit c5e2eeee2d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 14 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
src/routes/_components/compose/ComposeStickyButton.html
View file

@ -58,11 +58,11 @@
export default { export default {
oncreate () { oncreate () {
this.setupStickyObserver() this.setupIntersectionObservers()
this.setupIOSWorkaround() this.setupIOSWorkaround()
}, },
ondestroy () { ondestroy () {
this.teardownStickyObserver() this.teardownIntersectionObservers()
}, },
store: () => store, store: () => store,
data: () => ({ data: () => ({
@ -140,7 +140,7 @@
}) })
this.on('destroy', () => cleanup()) this.on('destroy', () => cleanup())
}, },
setupStickyObserver () { setupIntersectionObservers () {
const sentinel = this.refs.sentinel const sentinel = this.refs.sentinel
this.__stickyObserver = new IntersectionObserver(entries => this.onObserve(entries)) this.__stickyObserver = new IntersectionObserver(entries => this.onObserve(entries))
@ -150,21 +150,27 @@
// due to a bug in Firefox where when the scrollTop is set // due to a bug in Firefox where when the scrollTop is set
// manually, the other observer doesn't necessarily fire // manually, the other observer doesn't necessarily fire
this.observe('timelineInitialized', timelineInitialized => { this.observe('timelineInitialized', timelineInitialized => {
if (timelineInitialized) { if (timelineInitialized && !this.__oneShotObserver) {
const observer = new IntersectionObserver(entries => { this.__oneShotObserver = new IntersectionObserver(entries => {
this.onObserve(entries) this.onObserve(entries)
observer.disconnect() this.__oneShotObserver.disconnect()
this.__oneShotObserver = null
}) })
observer.observe(sentinel) this.__oneShotObserver.observe(sentinel)
} }
}, { init: false }) }, { init: false })
}, },
onObserve (entries) { onObserve (entries) {
this.set({ sticky: !entries[0].isIntersecting }) this.set({ sticky: !entries[0].isIntersecting })
}, },
teardownStickyObserver () { teardownIntersectionObservers () {
if (this.__stickyObserver) { if (this.__stickyObserver) {
this.__stickyObserver.disconnect() this.__stickyObserver.disconnect()
this.__stickyObserver = null
}
if (this.__oneShotObserver) {
this.__oneShotObserver.disconnect()
this.__oneShotObserver = null
} }
} }
}, },