You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
1.1 KiB
48 lines
1.1 KiB
7 years ago
|
import getRequestAnimationFrame, { cancelRequestAnimationFrame } from '../_util/getRequestAnimationFrame'
|
||
|
|
||
|
const reqAnimFrame = getRequestAnimationFrame()
|
||
|
|
||
|
export default function throttleByAnimationFrame (fn) {
|
||
|
let requestId
|
||
|
|
||
|
const later = args => () => {
|
||
|
requestId = null
|
||
|
fn(...args)
|
||
|
}
|
||
|
|
||
|
const throttled = (...args) => {
|
||
|
if (requestId == null) {
|
||
|
requestId = reqAnimFrame(later(args))
|
||
|
}
|
||
|
}
|
||
|
|
||
|
throttled.cancel = () => cancelRequestAnimationFrame(requestId)
|
||
|
|
||
|
return throttled
|
||
|
}
|
||
|
|
||
|
export function throttleByAnimationFrameDecorator () {
|
||
|
return function (target, key, descriptor) {
|
||
|
const fn = descriptor.value
|
||
|
let definingProperty = false
|
||
|
return {
|
||
|
configurable: true,
|
||
|
get () {
|
||
|
if (definingProperty || this === target.prototype || this.hasOwnProperty(key)) {
|
||
|
return fn
|
||
|
}
|
||
|
|
||
|
const boundFn = throttleByAnimationFrame(fn.bind(this))
|
||
|
definingProperty = true
|
||
|
Object.defineProperty(this, key, {
|
||
|
value: boundFn,
|
||
|
configurable: true,
|
||
|
writable: true,
|
||
|
})
|
||
|
definingProperty = false
|
||
|
return boundFn
|
||
|
},
|
||
|
}
|
||
|
}
|
||
|
}
|