rt

redux-throttle

Redux middleware to throttle your actions

Showing:

Popularity

Downloads/wk

3.6K

GitHub Stars

35

Maintenance

Last Commit

1yr ago

Contributors

2

Package

Dependencies

1

Size (min+gzip)

1.6KB

License

MIT

Type Definitions

Tree-Shakeable

Yes?

Categories

Readme

redux-throttle

build status npm version Dependency Status devDependency Status

Redux middleware to throttle your actions

npm install --save redux-throttle

Usage

import {createStore, applyMiddleware} from "redux";
import throttle from "redux-throttle";
import reducers from "./reducers";

const defaultWait = 300
const defaultThrottleOption = { // https://lodash.com/docs#throttle
  leading: true,
  trailing: true
}

const middleware = throttle(defaultWait, defaultThrottleOption);
const store = applyMiddleware(middleware)(createStore)(reducers);

Then you just have to dispatch actions with the meta throttle:

{
  type: 'ACTION_TYPE',
  meta: {
    throttle: true
  }
}

{
  type: 'ACTION_TYPE_2',
  meta: {
    throttle: 300 // wait time
  }
}

{
  type: 'ACTION_TYPE_3',
  meta: {
    throttle: {
      wait: 300,
      leading: false
    }
  }
}

There are 2 special actions exported by the library:

import {CANCEL, FLUSH} from "redux-throttle";

dispatch({
  type: CANCEL,
  payload: {
    type: 'ACTION_TYPE'
  }
})

dispatch({
  type: FLUSH,
  payload: {
    type: ['ACTION_TYPE_2', 'ACTION_TYPE_3']
  }
})

dispatch({ // will flush everything
  type: FLUSH
})

Both of them can be used to respectively cancel or flush a throttled action.

License

MIT

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100