Skip to content
TypeScript JavaScript
Branch: master
Clone or download

Latest commit

Fetching latest commit…
Cannot retrieve the latest commit at this time.

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github/workflows ci(github): check building on each run Mar 24, 2020
.vscode test: add tests with fork support Mar 24, 2020
src feat: derive name from passed trigger Mar 24, 2020
tests feat: derive name from passed trigger Mar 24, 2020
.babelrc test: add tests with fork support Mar 24, 2020
.commitlintrc.json feat: initial Feb 17, 2020
.editorconfig feat: initial Feb 17, 2020
.eslintignore feat: initial Feb 17, 2020
.eslintrc.json test: add tests with fork support Mar 24, 2020
.gitignore feat: initial Feb 17, 2020
.huskyrc feat: initial Feb 17, 2020
.prettierrc.json feat: initial Feb 17, 2020
README.md docs: add doc about name change Mar 24, 2020
jest.config.js test: add tests with fork support Mar 24, 2020
package.json 1.1.0 Mar 24, 2020
rollup.config.js feat: initial Feb 17, 2020
tsconfig.json feat: initial Feb 17, 2020
yarn.lock feat: upgrade dependencies Mar 24, 2020

README.md

Effector Debounce

npm bundle size

https://codesandbox.io/s/effector-throttle-debounce-w32tk

Installation

npm install --save effector effector-debounce

# or

yarn add effector effector-debounce

Usage

Create event that should be debounced:

import { createEvent } from 'effector';

const someHappened = createEvent<number>();

Create debounced event from it:

import { createDebounce } from 'effector-debounce';

const DEBOUNCE_TIMEOUT_IN_MS = 200;

const debounced = createDebounce(someHappened, DEBOUNCE_TIMEOUT_IN_MS);

To test that original event is correctly debounced you can add watcher:

someHappened.watch((payload) => {
  console.info('someHappened now', payload);
});

debounced(1);
debounced(2);
debounced(3);
debounced(4);

// someHappened now 4

Also you can use Effect and Store as trigger. createDebounce always returns Event:

const event = createEvent<number>();
const debouncedEvent: Event<number> = createDebounce(event, 100);

const fx = createEffect<number, void>();
const debouncedEffect: Event<number> = createDebounce(fx, 100);

const $store = createStore<number>(0);
const debouncedStore: Event<number> = createDebounce($store, 100);

Change name

const trigger = createEvent();
const debounced = createDebounce(trigger, 100);

// Now debounced var has `triggerDebounceTick` name

To change name:

const trigger = createEvent();
const debounced = createDebounce(trigger, 100, { name: 'Hello' });

// Now debounced var has `HelloDebounceTick` name
You can’t perform that action at this time.