scrollイベントに関連するactionなど、大量に発生するactionを間引く、Redux middlewareを作りました。

インストール

$ npm install --save redux-throttle-actions

使い方

第1引数は間引きたいAction Typeを配列もしくは文字列で指定します。文字列の場合は、
内部で配列にして処理します。
第2引数は間引きたい秒数をmillisecondsで指定します。

import {createStore, applyMiddleware} from "redux";
import throttleActions from "redux-throttle-actions";
// combineReducersされたreducer達
import reducers from "./reducers";
import {someType} from "./constants/actionTypes";

// someTypeが実行頻度が100msに一度になるように間引く
const throttleSomeType = throttleActions(someType, 100);
const store = applyMiddleware(throttleSomeType)(createStore)(reducers);

// In view
store.dispatch({ type: someType, ... }); // dispatchされる
store.dispatch({ type: someType, ... }); // 間引かれて、dispatchされない
store.dispatch({ type: someType, ... }); // 間引かれて、dispatchされない

// 一度目のdispatchから100ms経過

store.dispatch({ type: someType, ... }); // dispatchされる

内部でlodashのthrottle関数を使っており、
第3引数はthrottle関数の第3引数に渡される。（options.leadingとoptions.trailing）

// そのまま内部で使っている_.throttleの第3引数に渡される
const options = { leading: true, trailing: true };
const throttleSomeType = throttleActions(someType, 100, options);

バグや要望とはGithubのIssueでお願いしますー