Improved mountable performance

This commit is contained in:
Eduard Urbach 2017-07-05 15:29:18 +02:00
parent 59daa5404e
commit 3f0e778984
2 changed files with 35 additions and 14 deletions

View File

@ -95,11 +95,11 @@ export function diff(arn: AnimeNotifier, element: HTMLElement) {
let oldScroll = arn.app.content.parentElement.scrollTop let oldScroll = arn.app.content.parentElement.scrollTop
let newScroll = Math.max(target.offsetTop - contentPadding, 0) let newScroll = Math.max(target.offsetTop - contentPadding, 0)
let scrollDistance = newScroll - oldScroll let scrollDistance = newScroll - oldScroll
let timeStart = performance.now() let timeStart = Date.now()
let timeEnd = timeStart + duration let timeEnd = timeStart + duration
let scroll = () => { let scroll = () => {
let time = performance.now() let time = Date.now()
let progress = (time - timeStart) / duration let progress = (time - timeStart) / duration
if(progress > 1.0) { if(progress > 1.0) {

View File

@ -215,15 +215,16 @@ export class AnimeNotifier {
} }
modifyDelayed(className: string, func: (element: HTMLElement) => void) { modifyDelayed(className: string, func: (element: HTMLElement) => void) {
let mountableTypes = {
general: 0
}
const delay = 20 const delay = 20
const maxDelay = 1000
let time = 0 let time = 0
let start = Date.now()
let collection = document.getElementsByClassName(className) let collection = document.getElementsByClassName(className)
let mutations = []
let mountableTypes = {
general: start
}
for(let i = 0; i < collection.length; i++) { for(let i = 0; i < collection.length; i++) {
let element = collection.item(i) as HTMLElement let element = collection.item(i) as HTMLElement
@ -232,17 +233,37 @@ export class AnimeNotifier {
if(type in mountableTypes) { if(type in mountableTypes) {
time = mountableTypes[type] += delay time = mountableTypes[type] += delay
} else { } else {
time = mountableTypes[type] = 0 time = mountableTypes[type] = start
} }
if(time > maxDelay) { mutations.push({
func(element) element,
} else { time
setTimeout(() => { })
window.requestAnimationFrame(() => func(element)) }
}, time)
let mutationIndex = 0
let updateBatch = () => {
let now = Date.now()
for(; mutationIndex < mutations.length; mutationIndex++) {
let mutation = mutations[mutationIndex]
console.log(mutation.time - now)
if(mutation.time > now) {
break
}
func(mutation.element)
}
if(mutationIndex < mutations.length) {
window.requestAnimationFrame(updateBatch)
} }
} }
window.requestAnimationFrame(updateBatch)
} }
diff(url: string) { diff(url: string) {