3 ms·
Redux can come off as a bit intimidating, but fortunately builds entirely on old ideas and concepts like publish/subscribe, reduce/fold and pure functions that
by eiriklv 10y ago
Redux can come off as a bit intimidating, but fortunately builds entirely on old ideas and concepts like publish/subscribe, reduce/fold and pure functions that takes a value + an event and returns a new value (reducer function).
Without the middleware support Redux pretty much boils down to this:
function createStore(reducer) {
let state = undefined;
let subscribers = [];
return {
getState() {
return state;
},
subscribe(subscriber) {
subscribers.push(subscriber);
},
dispatch(action) {
state = reducer(state, action);
subscribers.forEach(subscriber => subscriber());
}
};
}
The advantage of Redux will start to show itself first when your app grows larger and you start doing things like consuming many different views/derivatives of the same state (using selectors) spread across your application.
Redux (core) doesn't actually solve the other big complexity culprit of big web applications though - asynchronous flow and side effects. For that you'll have to look into middlewares like redux-thunk or redux-saga, depending on your needs.
I'd suggest that instead of focusing on specific implementations such as Redux it's a good idea to take a look at those concepts + patterns like CQRS to get an understanding of why you'd want these things in the first place.
It's usually a good idea to feel the pain it alleviates before diving in at the deep end.
- eiriklv 10y agoAn alternative thought model of Redux could be represented like this: function createStore(reducer) { let actions = []; let subscribers = []; return { getState() { return actions.reduce(reducer, undefined); }, subscribe(subscriber) { subscribers.push(subscriber); }, dispatch(action) { actions.push(action); subscribers.forEach(subscriber => subscriber()); } }; } If you start out by digging into how Array.reduce works you're 90% there, which is where the name "Redux" comes from.