Redux "container" that let you run all your redux code (reducers, thunk, sagas, actions, etc...) inside a web worker that communicate with the main app thread and update the main store accordingly.
npm install coffeekraken-redux-full-worker --save
Let's check first our app.js
file that bootstrap our application
import ReactDOM from 'react-dom'
import { Provider } from 'react-redux'
import ReduxWorker from './redux.worker'
import { applyMiddleware } from 'redux'
import { createStore } from 'coffeekraken-redux-full-worker'
// some reducers if needed in the main thread
// but all the main reducers will live in the worker.
// !! don't combine the reducers here cause it will be done
// by the createStore function
const reducers = {
// key: reducerFn
}
// create our store
const store = createStore(ReduxWorker, reducers, {
// initial state. Important cause we don't have all the reducers
// to initialise our state
// key: stateObj
}, applyMiddleware(...))
// render our app with our store
ReactDOM.render(
<Provider store={store}>
// etc...
</Provider>,
document.querySelector('#root')
)
Next we have our redux.worker.js
file that is the main of all our workerized code. Here's how it looks:
import { createStore, applyMiddleware, combineReducers } from 'redux'
import { expose } from 'coffeekraken-redux-full-worker'
import reducers from '...' // your application reducers
// create the actual store of our app with middlewares, etc...
const store = createStore(
combineReducers(reducers),
{},
applyMiddleware(...)
)
// expose your store to the main app
expose(store, self)
In order for this middleware to work, you'll need to install the worker-loader webpack loader.
npm install worker-loader --save-dev
Here's an example of webpack configuration:
module.exports = {
//...
module: {
rules: [{
test: /\.worker\.js$/,
use: {
loader: 'worker-loader',
options: {
inline: true,
fallback: false
}
}
}]
}
}
IE / Edge |
Firefox |
Chrome |
Safari |
---|---|---|---|
IE11+ | last 2 versions | last 2 versions | last 2 versions |
As browsers are automatically updated, we will keep as reference the last two versions of each but this component can work on older ones as well.
This is an open source project and will ever be! You are more that welcomed to contribute to his development and make it more awesome every day. To do so, you have several possibilities:
We try to be some cool guys that build some cool tools to make our (and yours hopefully) every day life better.
The code is available under the MIT license. This mean that you can use, modify, or do whatever you want with it. This mean also that it is shipped to you for free, so don't be a hater and if you find some issues, etc... feel free to contribute instead of sharing your frustrations on social networks like an asshole...