frame-throttle
Advanced tools
Comparing version 2.0.1 to 3.0.0
@@ -6,2 +6,35 @@ # Change Log | ||
## [3.0.0] - 2017-08-28 | ||
### Added | ||
- Throttled listeners can now be canceled (useful for cleanup): | ||
```js | ||
var throttledListener = throttle(listener); | ||
window.addEventListener('resize', throttledListener); | ||
submitButton.addEventListener('click', () => { | ||
window.removeEventListener('resize', throttledListener); | ||
// prevent any queued calls from executing on the next animation frame: | ||
throttledListener.cancel(); | ||
}) | ||
``` | ||
### Changed | ||
- Updated types to use generics; `throttle` will now return a function | ||
of the same type it was passed. | ||
- frame-throttle now runs in strict mode | ||
### Fixed | ||
- Binding a throttled listener with `.bind()` resulted in both the bound and | ||
unbound listeners being throttled together. | ||
For instance, in the following scenario, `listener` was only being called once: | ||
```js | ||
var throttledListener = throttle(listener); | ||
var boundThrottledListener1 = throttledListener.bind(someContext); | ||
var boundThrottledListener2 = throttledListener.bind(anotherContext); | ||
throttledListener(); | ||
boundThrottledListener1(); | ||
boundThrottledListener2(); | ||
``` | ||
## [2.0.1] - 2016-09-26 | ||
@@ -14,2 +47,3 @@ ### Fixed | ||
- `frame-throttle.d.ts` - a [TypeScript declaration file] for `frame-throttle.js` | ||
### Changed | ||
@@ -21,3 +55,3 @@ - Converted project to [TypeScript] | ||
This means that you must now use: | ||
``` | ||
```js | ||
// Correct | ||
@@ -27,3 +61,3 @@ var throttle = require('frame-throttle').throttle; | ||
rather than | ||
``` | ||
```js | ||
// Wrong! | ||
@@ -36,2 +70,3 @@ var throttle = require('frame-throttle'); | ||
This only happens when `requestAnimationFrame` is present. | ||
### Known Issues | ||
@@ -60,4 +95,5 @@ - `package.json` was misconfigured and didn't include the correct files | ||
[1.1.0]: https://github.com/pelotoncycle/frame-throttle/compare/v1.0.0...v1.1.0 | ||
[2.0.0]: https://github.com/pelotoncycle/frame-throttle/compare/v1.1.0...v2.0.0 | ||
[2.0.1]: https://github.com/pelotoncycle/frame-throttle/compare/v1.1.0...v2.0.1 | ||
[2.0.0]: https://github.com/pelotoncycle/frame-throttle/compare/v1.1.0...v2.0.0 | ||
[1.1.0]: https://github.com/pelotoncycle/frame-throttle/compare/v1.0.0...v1.1.0 | ||
[3.0.0]: https://github.com/pelotoncycle/frame-throttle/compare/v2.0.1...v3.0.0 |
@@ -1,2 +0,14 @@ | ||
export declare type CallbackFunction = (...args: any[]) => void; | ||
export declare const throttle: (callback: CallbackFunction) => CallbackFunction; | ||
export declare type Cancellable<T extends Function> = T & { | ||
/** | ||
* Cancel the next scheduled invocation of the callback. | ||
*/ | ||
cancel(): void; | ||
}; | ||
/** | ||
* Returns a throttled function which runs once per rendered frame using | ||
* requestAnimationFrame. If window.requestAnimationFrame does not exist, | ||
* the behavior will be approximated using setTimeout. | ||
* | ||
* @param callback the function to be throttled | ||
*/ | ||
export declare const throttle: <T extends Function>(callback: T) => Cancellable<T>; |
@@ -1,26 +0,67 @@ | ||
exports.throttle = function (callback) { | ||
var running = false; | ||
function resetRunning() { | ||
running = false; | ||
} | ||
var callbackThis; | ||
var args; | ||
return function () { | ||
callbackThis = this; | ||
args = arguments; | ||
if (running) { | ||
"use strict"; | ||
exports.__esModule = true; | ||
var wrapperFactory = function (wrapperContext) { | ||
var resetCancelToken = function () { | ||
wrapperContext.cancelToken = false; | ||
}; | ||
var wrapper = function (cbThis, cb) { | ||
var args = []; | ||
for (var _i = 2; _i < arguments.length; _i++) { | ||
args[_i - 2] = arguments[_i]; | ||
} | ||
wrapperContext.callbackThis = cbThis; | ||
wrapperContext.args = args; | ||
if (wrapperContext.cancelToken) { | ||
return; | ||
} | ||
running = true; | ||
if ('requestAnimationFrame' in window) { | ||
window.requestAnimationFrame(function () { | ||
callback.apply(callbackThis, args); | ||
resetRunning(); | ||
wrapperContext.cancelToken = window.requestAnimationFrame(function () { | ||
cb.apply(wrapperContext.callbackThis, wrapperContext.args); | ||
resetCancelToken(); | ||
}); | ||
} | ||
else { | ||
callback.apply(callbackThis, args); | ||
window.setTimeout(resetRunning, 1000 / 60); // 60 fps | ||
cb.apply(wrapperContext.callbackThis, wrapperContext.args); | ||
wrapperContext.cancelToken = window.setTimeout(resetCancelToken, 1000 / 60); // 60 fps | ||
} | ||
}; | ||
wrapper.cancel = function () { | ||
if ('requestAnimationFrame' in window) { | ||
window.cancelAnimationFrame(wrapperContext.cancelToken); | ||
} | ||
window.clearTimeout(wrapperContext.cancelToken); | ||
resetCancelToken(); | ||
}; | ||
return wrapper; | ||
}; | ||
var throttleFactory = function (callback, thisArg) { | ||
var argArray = []; | ||
for (var _i = 2; _i < arguments.length; _i++) { | ||
argArray[_i - 2] = arguments[_i]; | ||
} | ||
var wrapper = wrapperFactory({}); | ||
var argCount = arguments.length; | ||
var throttledCallback = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
wrapper.apply(void 0, [argCount > 1 ? thisArg : this, callback].concat(argArray, args)); | ||
}; | ||
throttledCallback.cancel = function () { return wrapper.cancel(); }; | ||
return throttledCallback; | ||
}; | ||
/** | ||
* Returns a throttled function which runs once per rendered frame using | ||
* requestAnimationFrame. If window.requestAnimationFrame does not exist, | ||
* the behavior will be approximated using setTimeout. | ||
* | ||
* @param callback the function to be throttled | ||
*/ | ||
exports.throttle = function (callback) { | ||
var throttledCallback = throttleFactory(callback); | ||
// Override `bind()` to create a new throttled callback, otherwise both | ||
// the unbound and bound callbacks will have the same scope. | ||
throttledCallback.bind = throttleFactory.bind(null, callback); | ||
return throttledCallback; | ||
}; |
{ | ||
"name": "frame-throttle", | ||
"version": "2.0.1", | ||
"version": "3.0.0", | ||
"description": "A lightweight way to throttle events and callbacks using requestAnimationFrame", | ||
@@ -14,10 +14,10 @@ "main": "dist/frame-throttle.js", | ||
"clean": "del-cli dist", | ||
"compile": "npm run clean && tsc", | ||
"coveralls": "npm run test-cov -- --report lcovonly && cat coverage/lcov.info | coveralls", | ||
"lint": "npm run lint-noforce -- --force", | ||
"lint-noforce": "tslint --project tsconfig.json", | ||
"compile": "npm run clean && tsc", | ||
"pretest": "npm run lint-noforce && npm run compile", | ||
"prepublish": "npm test", | ||
"test": "tape dist/tests/*.tests.js", | ||
"test-cov": "npm run pretest && istanbul cover tape -- dist/tests/*.tests.js", | ||
"coveralls": "npm run test-cov -- --report lcovonly && cat coverage/lcov.info | coveralls" | ||
"test-cov": "npm run pretest && istanbul cover tape -- dist/tests/*.tests.js" | ||
}, | ||
@@ -45,2 +45,4 @@ "keywords": [ | ||
"devDependencies": { | ||
"@types/jsdom": "11.0.1", | ||
"@types/mock-raf": "1.0.2", | ||
"@types/sinon": "^1.16.31", | ||
@@ -50,4 +52,4 @@ "coveralls": "^2.11.12", | ||
"istanbul": "0.4.5", | ||
"jsdom": "^9.4.1", | ||
"mock-raf": "0.0.2", | ||
"jsdom": "11.1.0", | ||
"mock-raf": "1.0.0", | ||
"sinon": "^1.17.5", | ||
@@ -57,4 +59,4 @@ "tape": "^4.6.0", | ||
"tslint": "^3.15.1", | ||
"typescript": "^2.0.3" | ||
"typescript": "2.4.2" | ||
} | ||
} |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
No README
QualityPackage does not have a README. This may indicate a failed publish or a low quality package.
Found 1 instance in 1 package
17150
7
81
0
133
0
13